diff --git a/app/styles/play/campaign-view.sass b/app/styles/play/campaign-view.sass index e14d5ba5f..444248910 100644 --- a/app/styles/play/campaign-view.sass +++ b/app/styles/play/campaign-view.sass @@ -243,6 +243,21 @@ $gameControlMargin: 30px min-width: 200px display: block margin: 10px auto 0 auto + position: relative + + .badge + position: absolute + top: initial + left: initial + right: -25px + bottom: -25px + font-size: 20px + color: black + border: 1px solid black + background-color: rgb(232, 217, 87) + border-radius: 50% + opacity: 1 + padding: 3px 9px &.complete .start-level, .view-solutions diff --git a/app/views/play/CampaignView.coffee b/app/views/play/CampaignView.coffee index 5057cc7e6..cc8108b44 100644 --- a/app/views/play/CampaignView.coffee +++ b/app/views/play/CampaignView.coffee @@ -286,9 +286,6 @@ module.exports = class CampaignView extends RootView @levelStatusMap[session.get('levelID')] = if session.get('state')?.complete then 'complete' else 'started' @render() - onClickMap: (e) -> - @$levelInfo?.hide() - preloadLevel: (levelSlug) -> levelURL = "/db/level/#{levelSlug}" level = new Level().setURL levelURL @@ -297,6 +294,18 @@ module.exports = class CampaignView extends RootView @preloadedSession = new LevelSession().setURL sessionURL @preloadedSession.levelSlug = levelSlug @preloadedSession.fetch() + @listenToOnce @preloadedSession, 'sync', @onSessionPreloaded + + onSessionPreloaded: (session) -> + levelElement = @$el.find('.level-info-container:visible') + return unless session.levelSlug is levelElement.data 'level-slug' + return unless difficulty = session.get('state')?.difficulty + badge = $("<span class='badge'>#{difficulty}</span>") + levelElement.find('.start-level .badge').remove() + levelElement.find('.start-level').append badge + + onClickMap: (e) -> + @$levelInfo?.hide() onClickLevel: (e) -> e.preventDefault()