mirror of
https://github.com/codeninjasllc/codecombat.git
synced 2025-02-16 00:19:50 -05:00
Moved world map level info to click from hover.
This commit is contained in:
Nick Winter
parent
5397c51819
commit
225fd0ca18
3 changed files with 32 additions and 44 deletions
|
|
@ -116,13 +116,9 @@ $gameControlMargin: 30px
|
|||
display: none
|
||||
position: absolute
|
||||
z-index: 3
|
||||
padding: 10px 10px 30px 10px
|
||||
padding: 10px
|
||||
border-image: url(/images/level/popover_background.png) 18 fill round
|
||||
border-width: 15px
|
||||
|
||||
.level-image
|
||||
float: left
|
||||
margin-right: 20px
|
||||
|
||||
.level-info.complete h3:after
|
||||
content: " - Complete!"
|
||||
|
|
@ -133,9 +129,6 @@ $gameControlMargin: 30px
|
|||
color: desaturate(green, 50%)
|
||||
|
||||
.level-info
|
||||
width: 330px
|
||||
float: left
|
||||
|
||||
h3
|
||||
margin-top: 0
|
||||
margin-bottom: 0px
|
||||
|
|
@ -146,6 +139,11 @@ $gameControlMargin: 30px
|
|||
|
||||
.campaign-label
|
||||
text-shadow: 0 1px 0 white
|
||||
|
||||
.start-level
|
||||
display: block
|
||||
margin: 10px auto 0 auto
|
||||
width: 200px
|
||||
|
||||
.game-controls
|
||||
position: absolute
|
||||
|
|
|
|||
|
|
@ -9,11 +9,7 @@
|
|||
div(style="left: #{level.x}%; bottom: #{level.y}%; background-color: #{campaign.color}", class="level" + (next ? " next" : "") + (level.disabled ? " disabled" : "") + " " + levelStatusMap[level.id] || "", data-level-id=level.id)
|
||||
a(href=level.type == 'hero' ? '#' : level.disabled ? "/play" : "/play/#{level.levelPath || 'level'}/#{level.id}", disabled=level.disabled, data-level-id=level.id, data-level-path=level.levelPath || 'level', data-level-name=level.name)
|
||||
div(style="left: #{level.x}%; bottom: #{level.y}%", class="level-shadow" + (next ? " next" : "") + " " + levelStatusMap[level.id] || "")
|
||||
.level-info-container(data-level-id=level.id)
|
||||
//if level.image
|
||||
// img.level-image(src="#{level.image}", alt="#{level.name}")
|
||||
//else
|
||||
// img.level-image(src="/images/generic-icon.png", alt="#{level.name}")
|
||||
.level-info-container(data-level-id=level.id, data-level-path=level.levelPath || 'level', data-level-name=level.name)
|
||||
div(class="level-info " + (levelStatusMap[level.id] || ""))
|
||||
h3= level.name + (level.disabled ? " (Coming soon!)" : "")
|
||||
.level-description= level.description
|
||||
|
|
@ -28,6 +24,7 @@
|
|||
span.spr , #{Math.round(playCount.playtime / 3600)}
|
||||
span(data-i18n="play.hours_played") hours played
|
||||
.campaign-label(style="color: #{campaign.color}")= campaign.name
|
||||
button.btn.btn-success.btn-lg.start-level(data-i18n="common.play") Play
|
||||
|
||||
.game-controls.header-font
|
||||
if me.isAdmin()
|
||||
|
|
|
|||
|
|
@ -18,11 +18,12 @@ module.exports = class WorldMapView extends RootView
|
|||
template: template
|
||||
|
||||
events:
|
||||
'click .map': 'onClickMap'
|
||||
'click .map-background': 'onClickMap'
|
||||
'click .level a': 'onClickLevel'
|
||||
'mouseenter .level a': 'onMouseEnterLevel'
|
||||
'mouseleave .level a': 'onMouseLeaveLevel'
|
||||
'mousemove .map': 'onMouseMoveMap'
|
||||
'click .level-info-container .start-level': 'onClickStartLevel'
|
||||
#'mouseenter .level a': 'onMouseEnterLevel'
|
||||
#'mouseleave .level a': 'onMouseLeaveLevel'
|
||||
#'mousemove .map': 'onMouseMoveMap'
|
||||
|
||||
constructor: (options) ->
|
||||
super options
|
||||
|
|
@ -78,6 +79,7 @@ module.exports = class WorldMapView extends RootView
|
|||
@render()
|
||||
|
||||
onClickMap: (e) ->
|
||||
@$levelInfo?.hide()
|
||||
# Easy-ish way of figuring out coordinates for placing level dots.
|
||||
x = e.offsetX / @$el.find('.map-background').width()
|
||||
y = (1 - e.offsetY / @$el.find('.map-background').height())
|
||||
|
|
@ -85,21 +87,30 @@ module.exports = class WorldMapView extends RootView
|
|||
|
||||
onClickLevel: (e) ->
|
||||
e.preventDefault()
|
||||
e.stopPropagation()
|
||||
@$levelInfo?.hide()
|
||||
return if $(e.target).attr('disabled')
|
||||
playLevelModal = new PlayLevelModal supermodel: @supermodel, levelID: $(e.target).data('level-id'), levelPath: $(e.target).data('level-path'), levelName: $(e.target).data('level-name')
|
||||
@openModalView playLevelModal
|
||||
|
||||
onMouseEnterLevel: (e) ->
|
||||
levelID = $(e.target).parents('.level').data('level-id')
|
||||
@$levelInfo = @$el.find(".level-info-container[data-level-id=#{levelID}]").show()
|
||||
@adjustLevelInfoPosition e
|
||||
|
||||
onMouseLeaveLevel: (e) ->
|
||||
levelID = $(e.target).parents('.level').data('level-id')
|
||||
@$el.find(".level-info-container[data-level-id='#{levelID}']").hide()
|
||||
onClickStartLevel: (e) ->
|
||||
container = $(e.target).parents('.level-info-container')
|
||||
playLevelModal = new PlayLevelModal supermodel: @supermodel, levelID: container.data('level-id'), levelPath: container.data('level-path'), levelName: container.data('level-name')
|
||||
@openModalView playLevelModal
|
||||
@$levelInfo?.hide()
|
||||
|
||||
onMouseMoveMap: (e) ->
|
||||
@adjustLevelInfoPosition e
|
||||
#onMouseEnterLevel: (e) ->
|
||||
# levelID = $(e.target).parents('.level').data('level-id')
|
||||
# @$levelInfo = @$el.find(".level-info-container[data-level-id=#{levelID}]").show()
|
||||
# @adjustLevelInfoPosition e
|
||||
#
|
||||
#onMouseLeaveLevel: (e) ->
|
||||
# levelID = $(e.target).parents('.level').data('level-id')
|
||||
# @$el.find(".level-info-container[data-level-id='#{levelID}']").hide()
|
||||
#
|
||||
#onMouseMoveMap: (e) ->
|
||||
# @adjustLevelInfoPosition e
|
||||
|
||||
adjustLevelInfoPosition: (e) ->
|
||||
return unless @$levelInfo
|
||||
|
|
@ -476,7 +487,6 @@ hero = [
|
|||
type: 'hero'
|
||||
difficulty: 1
|
||||
id: 'dungeons-of-kithgard'
|
||||
image: '/file/db/level/52740644904ac0411700067c/rescue_mission_icon.png'
|
||||
description: 'Grab the gem, but touch nothing else. Start here.'
|
||||
x: 17.23
|
||||
y: 36.94
|
||||
|
|
@ -486,7 +496,6 @@ hero = [
|
|||
type: 'hero'
|
||||
difficulty: 1
|
||||
id: 'gems-in-the-deep'
|
||||
image: '/file/db/level/529662dfe0df8f0000000007/grab_the_mushroom_icon.png'
|
||||
description: 'Quickly collect the gems; you will need them.'
|
||||
x: 22.6
|
||||
y: 35.1
|
||||
|
|
@ -496,7 +505,6 @@ hero = [
|
|||
type: 'hero'
|
||||
difficulty: 1
|
||||
id: 'shadow-guard'
|
||||
image: '/file/db/level/525dc5589a0765e496000006/drink_me_icon.png'
|
||||
description: 'Evade the Kithgard minion.'
|
||||
x: 27.74
|
||||
y: 35.17
|
||||
|
|
@ -506,7 +514,6 @@ hero = [
|
|||
type: 'hero'
|
||||
difficulty: 1
|
||||
id: 'true-names'
|
||||
image: '/file/db/level/5276c9bdcf83207a2801ff8f/taunt_icon.png'
|
||||
description: 'Learn an enemy\'s true name to defeat it.'
|
||||
x: 32.7
|
||||
y: 36.7
|
||||
|
|
@ -516,7 +523,6 @@ hero = [
|
|||
type: 'hero'
|
||||
difficulty: 1
|
||||
id: 'the-raised-sword'
|
||||
image: '/file/db/level/528aea2d7f37fc4e0700016b/its_a_trap_icon.png'
|
||||
description: 'Learn to equip yourself for combat.'
|
||||
x: 36.6
|
||||
y: 39.5
|
||||
|
|
@ -526,7 +532,6 @@ hero = [
|
|||
type: 'hero'
|
||||
difficulty: 1
|
||||
id: 'the-first-kithmaze'
|
||||
image: '/file/db/level/5275272c69abdcb12401216e/break_the_prison_icon.png'
|
||||
description: 'The builders of Kith constructed many mazes to confuse travelers.'
|
||||
x: 38.4
|
||||
y: 43.5
|
||||
|
|
@ -536,7 +541,6 @@ hero = [
|
|||
type: 'hero'
|
||||
difficulty: 1
|
||||
id: 'the-second-kithmaze'
|
||||
image: '/file/db/level/525f150306e1ab0962000018/taunt_icon.png'
|
||||
description: 'Many have tried, few have found their way through this maze.'
|
||||
x: 38.9
|
||||
y: 48.1
|
||||
|
|
@ -546,7 +550,6 @@ hero = [
|
|||
type: 'hero'
|
||||
difficulty: 1
|
||||
id: 'new-sight'
|
||||
image: '/file/db/level/525abfd9b12777d78e000009/cowardly_taunt_icon.png'
|
||||
description: 'A true name can only be seen with the correct lenses.'
|
||||
x: 39.3
|
||||
y: 53.1
|
||||
|
|
@ -556,7 +559,6 @@ hero = [
|
|||
type: 'hero'
|
||||
difficulty: 1
|
||||
id: 'lowly-kithmen'
|
||||
image: '/file/db/level/525ef8ef06e1ab0962000003/commanding_followers_icon.png'
|
||||
description: 'Use your glasses to seek out and attack the Kithmen.'
|
||||
x: 39.4
|
||||
y: 57.7
|
||||
|
|
@ -566,7 +568,6 @@ hero = [
|
|||
type: 'hero'
|
||||
difficulty: 1
|
||||
id: 'a-bolt-in-the-dark'
|
||||
image: '/file/db/level/525085419851b83f4b000001/mobile_artillery_icon.png'
|
||||
description: 'Kithmen are not the only ones to stand in your way.'
|
||||
x: 40.0
|
||||
y: 63.2
|
||||
|
|
@ -576,7 +577,6 @@ hero = [
|
|||
type: 'hero'
|
||||
difficulty: 1
|
||||
id: 'the-final-kithmaze'
|
||||
image: '/file/db/level/526bda3fe79aefde2a003e36/mobile_artillery_icon.png'
|
||||
description: 'To escape you must find your way through an Elder Kithman\'s maze.'
|
||||
x: 42.67
|
||||
y: 67.98
|
||||
|
|
@ -586,7 +586,6 @@ hero = [
|
|||
type: 'hero'
|
||||
difficulty: 1
|
||||
id: 'kithgard-gates'
|
||||
image: '/file/db/level/526fd3043c637ece50001bb2/the_herd_icon.png'
|
||||
description: 'Escape the Kithgard dungeons and don\'t let the guardians get you.'
|
||||
x: 47.38
|
||||
y: 70.55
|
||||
|
|
@ -596,7 +595,6 @@ hero = [
|
|||
type: 'hero'
|
||||
difficulty: 1
|
||||
id: 'defence-of-plainswood'
|
||||
image: '/file/db/level/525dc5589a0765e496000006/drink_me_icon.png'
|
||||
description: 'Protect the peasants from the pursuing ogres.'
|
||||
x: 52.66
|
||||
y: 69.66
|
||||
|
|
@ -606,7 +604,6 @@ hero = [
|
|||
# type: 'hero'
|
||||
# difficulty: 1
|
||||
# id: ''
|
||||
# image: '/file/db/level/529662dfe0df8f0000000007/grab_the_mushroom_icon.png'
|
||||
# description: ''
|
||||
# x: 58.46
|
||||
# y: 66.38
|
||||
|
|
@ -616,7 +613,6 @@ hero = [
|
|||
# type: 'hero'
|
||||
# difficulty: 1
|
||||
# id: ''
|
||||
# image: '/file/db/level/526ae95c1e5cd30000000008/zone_of_danger_icon.png'
|
||||
# description: ''
|
||||
# x: 63.11
|
||||
# y: 62.74
|
||||
|
|
@ -626,7 +622,6 @@ hero = [
|
|||
# type: 'hero'
|
||||
# difficulty: 1
|
||||
# id: ''
|
||||
# image: '/file/db/level/529662dfe0df8f0000000007/grab_the_mushroom_icon.png'
|
||||
# description: ''
|
||||
# x: 69.19
|
||||
# y: 60.61
|
||||
|
|
@ -636,7 +631,6 @@ hero = [
|
|||
# type: 'hero'
|
||||
# difficulty: 1
|
||||
# id: ''
|
||||
# image: '/file/db/level/52740644904ac0411700067c/rescue_mission_icon.png'
|
||||
# description: ''
|
||||
# x: 77.54
|
||||
# y: 65.94
|
||||
|
|
@ -646,7 +640,6 @@ hero = [
|
|||
# type: 'hero'
|
||||
# difficulty: 1
|
||||
# id: ''
|
||||
# image: '/file/db/level/526711d9add4f8965f000002/hunter_triplets_icon.png'
|
||||
# description: ''
|
||||
# x: 84.29
|
||||
# y: 61.23
|
||||
|
|
|
|||
Loading…
Reference in a new issue