diff --git a/app/lib/surface/SpriteBoss.coffee b/app/lib/surface/SpriteBoss.coffee index 7771462be..319358d58 100644 --- a/app/lib/surface/SpriteBoss.coffee +++ b/app/lib/surface/SpriteBoss.coffee @@ -283,6 +283,7 @@ module.exports = class SpriteBoss extends CocoClass return @dragged = 0 if @dragged > 3 @dragged = 0 sprite = if e.sprite?.thang?.isSelectable then e.sprite else null + return if @flagCursorSprite and sprite?.thangType.get('name') is 'Flag' @selectSprite e, sprite onStageMouseDown: (e) -> @@ -325,6 +326,8 @@ module.exports = class SpriteBoss extends CocoClass onFlagColorSelected: (e) -> @removeSprite @flagCursorSprite if @flagCursorSprite @flagCursorSprite = null + for flagSprite in @spriteArray when flagSprite.thangType.get('name') is 'Flag' + flagSprite.imageObject.cursor = if e.color then 'crosshair' else 'pointer' return unless e.color @flagCursorSprite = new FlagSprite @thangTypeFor('Flag'), @createSpriteOptions(thangID: 'Flag Cursor', color: e.color, team: me.team, isCursor: true, pos: e.pos) @addSprite @flagCursorSprite, @flagCursorSprite.thang.id, @spriteLayers['Floating'] @@ -349,11 +352,15 @@ module.exports = class SpriteBoss extends CocoClass foundExactMatch = true @pendingFlags.splice(i, 1) @removeSprite pendingFlag + e.sprite.imageObject.cursor = if @flagCursorSprite then 'crosshair' else 'pointer' null onRemoveSelectedFlag: (e) -> - return unless @selectedSprite and @selectedSprite.thangType.get('name') is 'Flag' and @selectedSprite.thang.team is me.team - Backbone.Mediator.publish 'surface:remove-flag', color: @selectedSprite.thang.color + # Remove the selected sprite if it's a flag, or any flag of the given color if a color is given. + flagSprite = _.find [@selectedSprite].concat(@spriteArray), (sprite) -> + sprite and sprite.thangType.get('name') is 'Flag' and sprite.thang.team is me.team and (sprite.thang.color is e.color or not e.color) and not sprite.notOfThisWorld + return unless flagSprite + Backbone.Mediator.publish 'surface:remove-flag', color: flagSprite.thang.color # Marks diff --git a/app/styles/play/level.sass b/app/styles/play/level.sass index c87d229bb..d2fa31a62 100644 --- a/app/styles/play/level.sass +++ b/app/styles/play/level.sass @@ -17,8 +17,14 @@ body.is-playing width: 100% canvas#surface margin: 0 auto - #control-bar-view, #playback-view + #control-bar-view width: 100% + #playback-view + $flags-width: 200px + width: 90% + width: -webkit-calc(100% - $flags-width) + width: calc(100% - $flags-width) + left: $flags-width #code-area, #thang-hud, #goals-view display: none visibility: hidden diff --git a/app/styles/play/level/level-flags-view.sass b/app/styles/play/level/level-flags-view.sass index 167f9227c..5ee49c10d 100644 --- a/app/styles/play/level/level-flags-view.sass +++ b/app/styles/play/level/level-flags-view.sass @@ -4,8 +4,11 @@ #level-flags-view display: none position: absolute - top: 42px - left: 1% + bottom: 0 + left: 0 + width: 200px + // Width must match level.sass playback offset + z-index: 1 @include transition(box-shadow .2s linear) @include user-select(none) padding: 4px @@ -19,11 +22,32 @@ .flag-button margin: 3px font-size: 14px + position: relative + padding: 2px 15px 18px 15px + margin-left: 5px + + .glyphicon + font-size: 24px + + .flag-shortcut + text-decoration: underline &.green-flag - color: darkgreen + .glyphicon, .flag-shortcut + color: hsl(120, 50%, 50%) &.black-flag - color: black + .glyphicon, .flag-shortcut + color: hsl(0, 0%, 25%) &.violet-flag - color: violet + .glyphicon, .flag-shortcut + color: hsl(300, 50%, 50%) + .flag-caption + position: absolute + background-color: rgba(0, 0, 0, 0.1) + color: black + bottom: 0 + left: 0 + width: 100% + border-bottom-right-radius: 6px + border-bottom-left-radius: 6px diff --git a/app/templates/play/level/level-flags-view.jade b/app/templates/play/level/level-flags-view.jade index 036ebf6c1..11f3d0f5e 100644 --- a/app/templates/play/level/level-flags-view.jade +++ b/app/templates/play/level/level-flags-view.jade @@ -1,9 +1,15 @@ -button.flag-button.btn.btn-xs.green-flag(title="g: Place a green flag") +button.flag-button.btn.btn-lg.green-flag(title="G: Place a green flag") span.glyphicon.glyphicon-flag - | g -button.flag-button.btn.btn-xs.black-flag(title="b: Place a black flag") + span.flag-caption + span.flag-shortcut G + | reen +button.flag-button.btn.btn-lg.black-flag(title="B: Place a black flag") span.glyphicon.glyphicon-flag - | b -button.flag-button.btn.btn-xs.violet-flag(title="v: Place a violet flag") + span.flag-caption + span.flag-shortcut B + | lack +button.flag-button.btn.btn-lg.violet-flag(title="V: Place a violet flag") span.glyphicon.glyphicon-flag - | v + span.flag-caption + span.flag-shortcut V + | iolet diff --git a/app/views/play/level/LevelFlagsView.coffee b/app/views/play/level/LevelFlagsView.coffee index 76d55a056..25bc54293 100644 --- a/app/views/play/level/LevelFlagsView.coffee +++ b/app/views/play/level/LevelFlagsView.coffee @@ -43,8 +43,7 @@ module.exports = class LevelFlagsView extends CocoView onFlagSelected: (e) -> return unless @realTime - return if @flagColor is e.color and e.source is 'shortcut' - color = if e.source is 'button' and e.color is @flagColor then null else e.color + color = if e.color is @flagColor then null else e.color @flagColor = color Backbone.Mediator.publish 'level:flag-color-selected', color: color @$el.find('.flag-button').removeClass('active') @@ -62,7 +61,6 @@ module.exports = class LevelFlagsView extends CocoView onDeletePressed: (e) -> return unless @realTime Backbone.Mediator.publish 'surface:remove-selected-flag', {} - @onFlagSelected color: null, source: 'shortcut' onRemoveFlag: (e) -> delete @flags[e.color]