From 68a4483e919d5274424b209d2e6f3da7d7ede470 Mon Sep 17 00:00:00 2001 From: Nick Winter Date: Mon, 19 May 2014 11:58:45 -0700 Subject: [PATCH] Moved views/play/ladder_view to views/play/ladder/ladder_view and made a new views/play/ladder_home_view. --- app/lib/Router.coffee | 3 +- app/locale/en.coffee | 1 - app/styles/play.sass | 3 - app/styles/play/{ => ladder}/ladder.sass | 0 app/styles/play/ladder_home.sass | 54 ++++++++++++++ app/templates/home.jade | 2 +- app/templates/play.jade | 6 -- app/templates/play/{ => ladder}/ladder.jade | 0 app/templates/play/ladder_home.jade | 23 ++++++ .../play/{ => ladder}/ladder_view.coffee | 12 ++-- app/views/play/ladder_home.coffee | 72 +++++++++++++++++++ app/views/play_view.coffee | 16 ++--- 12 files changed, 166 insertions(+), 26 deletions(-) rename app/styles/play/{ => ladder}/ladder.sass (100%) create mode 100644 app/styles/play/ladder_home.sass rename app/templates/play/{ => ladder}/ladder.jade (100%) create mode 100644 app/templates/play/ladder_home.jade rename app/views/play/{ => ladder}/ladder_view.coffee (91%) create mode 100644 app/views/play/ladder_home.coffee diff --git a/app/lib/Router.coffee b/app/lib/Router.coffee index 7c12e1cb8..603e4a7d0 100644 --- a/app/lib/Router.coffee +++ b/app/lib/Router.coffee @@ -17,7 +17,8 @@ module.exports = class CocoRouter extends Backbone.Router 'editor/:model(/:slug_or_id)(/:subview)': 'editorModelView' # Experimenting with direct links -# 'play/ladder/:levelID/team/:team': go('play/ladder/team_view') + 'play/ladder/:levelID': go('play/ladder/ladder_view') + 'play/ladder': go('play/ladder_home') # db and file urls call the server directly 'db/*path': 'routeToServer' diff --git a/app/locale/en.coffee b/app/locale/en.coffee index ec04add0f..36ae1aa16 100644 --- a/app/locale/en.coffee +++ b/app/locale/en.coffee @@ -214,7 +214,6 @@ candidate_active: "Them?" play_level: - level_load_error: "Level could not be loaded: " done: "Done" grid: "Grid" customize_wizard: "Customize Wizard" diff --git a/app/styles/play.sass b/app/styles/play.sass index e3e31d8fa..900207ca9 100644 --- a/app/styles/play.sass +++ b/app/styles/play.sass @@ -46,6 +46,3 @@ color: black text-shadow: 0 1px 0 white - .alert-warning h2 - color: black - text-align: center diff --git a/app/styles/play/ladder.sass b/app/styles/play/ladder/ladder.sass similarity index 100% rename from app/styles/play/ladder.sass rename to app/styles/play/ladder/ladder.sass diff --git a/app/styles/play/ladder_home.sass b/app/styles/play/ladder_home.sass new file mode 100644 index 000000000..805c0376e --- /dev/null +++ b/app/styles/play/ladder_home.sass @@ -0,0 +1,54 @@ +@import "app/styles/bootstrap/mixins" +@import "app/styles/bootstrap/variables" + +#ladder-home-view + .level + width: 100% + position: relative + margin-bottom: 20px + text-shadow: 2px 2px 5px black + + &:hover div + color: lighten($yellow, 20%) + + &:hover img + filter: brightness(1.2) + -webkit-filter: brightness(1.2) + box-shadow: 0 0 5px black + + .level-image + width: 100% + + .overlay-text + color: $yellow + font-family: Bangers + @include transition(color .10s linear) + + .level-difficulty + position: absolute + left: 0px + bottom: 0px + font-size: 25px + padding-right: 10px + background-color: rgba(255, 255, 255, 0.75) + border-radius: 6px + + .play-text-container + position: absolute + left: 50% + bottom: -10px + + .play-text + margin-left: -50% + font-size: 50px + + a[disabled] .level + opacity: 0.7 + + a.complete .level-difficulty:after + content: " - Complete!" + color: $yellow + + a.started .level-difficulty:after + content: " - Started" + color: desaturate($yellow, 50%) diff --git a/app/templates/home.jade b/app/templates/home.jade index 0fa7022e5..e790d40bf 100644 --- a/app/templates/home.jade +++ b/app/templates/home.jade @@ -50,7 +50,7 @@ block content h4(data-i18n="home.for_beginners") For Beginners .play-text(data-i18n="home.play") Play - a#multiplayer(href="/play/ladder/dungeon-arena") + a#multiplayer(href="/play/ladder") div.game-mode-wrapper if isEnglish img(src="/images/pages/home/multiplayer.jpg").img-rounded diff --git a/app/templates/play.jade b/app/templates/play.jade index 911f14c92..f8d07e62f 100644 --- a/app/templates/play.jade +++ b/app/templates/play.jade @@ -2,12 +2,6 @@ extends /templates/base block content - if notFound - div(class="alert alert-warning") - h2 - span(data-i18n="play_level.level_load_error") Level could not be loaded: - | #{notFound} - h1(data-i18n="play.choose_your_level") Choose Your Level p span(data-i18n="play.adventurer_prefix") You can jump to any level below, or discuss the levels on diff --git a/app/templates/play/ladder.jade b/app/templates/play/ladder/ladder.jade similarity index 100% rename from app/templates/play/ladder.jade rename to app/templates/play/ladder/ladder.jade diff --git a/app/templates/play/ladder_home.jade b/app/templates/play/ladder_home.jade new file mode 100644 index 000000000..e3b976ae6 --- /dev/null +++ b/app/templates/play/ladder_home.jade @@ -0,0 +1,23 @@ +extends /templates/base + +block content + + each campaign in campaigns + .campaign-container + h1 + a(href="/play/#{campaign.levels[0].levelPath || 'level'}/#{campaign.levels[0].id}", data-i18n="play.campaign_#{campaign.id}")= campaign.name + p.campaign-description(data-i18n="[html]play.campaign_#{campaign.id}_description")!= campaign.description + each level in campaign.levels + a(href=level.disabled ? "/play/ladder" : "/play/ladder/#{level.id}", disabled=level.disabled, class=levelStatusMap[level.id] || '', title=level.description) + .level + if level.image + img.level-image(src="#{level.image}", alt="#{level.name}").img-rounded + else + img.level-image(src="/images/pages/home/multiplayer_notext.jpg", alt="#{level.name}").img-rounded + //h3= level.name + (level.disabled ? " (Coming soon!)" : "") + .overlay-text.level-difficulty + span(data-i18n="play.level_difficulty") Difficulty: + each i in Array(level.difficulty) + | ★ + .play-text-container + .overlay-text.play-text(data-i18n="home.play") Play diff --git a/app/views/play/ladder_view.coffee b/app/views/play/ladder/ladder_view.coffee similarity index 91% rename from app/views/play/ladder_view.coffee rename to app/views/play/ladder/ladder_view.coffee index 26038ea81..dc9730009 100644 --- a/app/views/play/ladder_view.coffee +++ b/app/views/play/ladder/ladder_view.coffee @@ -2,14 +2,14 @@ RootView = require 'views/kinds/RootView' Level = require 'models/Level' LevelSession = require 'models/LevelSession' CocoCollection = require 'collections/CocoCollection' -{teamDataFromLevel} = require './ladder/utils' +{teamDataFromLevel} = require './utils' {me} = require 'lib/auth' application = require 'application' -LadderTabView = require './ladder/ladder_tab' -MyMatchesTabView = require './ladder/my_matches_tab' -SimulateTabView = require './ladder/simulate_tab' -LadderPlayModal = require './ladder/play_modal' +LadderTabView = require './ladder_tab' +MyMatchesTabView = require './my_matches_tab' +SimulateTabView = require './simulate_tab' +LadderPlayModal = require './play_modal' CocoClass = require 'lib/CocoClass' @@ -25,7 +25,7 @@ class LevelSessionsCollection extends CocoCollection module.exports = class LadderView extends RootView id: 'ladder-view' - template: require 'templates/play/ladder' + template: require 'templates/play/ladder/ladder' subscriptions: 'application:idle-changed': 'onIdleChanged' diff --git a/app/views/play/ladder_home.coffee b/app/views/play/ladder_home.coffee new file mode 100644 index 000000000..0150b2284 --- /dev/null +++ b/app/views/play/ladder_home.coffee @@ -0,0 +1,72 @@ +View = require 'views/kinds/RootView' +template = require 'templates/play/ladder_home' +LevelSession = require 'models/LevelSession' +CocoCollection = require 'collections/CocoCollection' + +class LevelSessionsCollection extends CocoCollection + url: '' + model: LevelSession + + constructor: (model) -> + super() + @url = "/db/user/#{me.id}/level.sessions?project=state.complete,levelID" + +module.exports = class LadderHomeView extends View + id: "ladder-home-view" + template: template + + constructor: (options) -> + super options + @levelStatusMap = {} + @sessions = new LevelSessionsCollection() + @sessions.fetch() + @listenToOnce @sessions, 'sync', @onSessionsLoaded + + onSessionsLoaded: (e) -> + for session in @sessions.models + @levelStatusMap[session.get('levelID')] = if session.get('state')?.complete then 'complete' else 'started' + @render() + + getRenderData: (context={}) -> + context = super(context) + arenas = [ + { + name: 'Greed' + difficulty: 4 + id: 'greed' + image: '/file/db/level/53558b5a9914f5a90d7ccddb/greed_banner.jpg' + description: "Liked Dungeon Arena and Gold Rush? Put them together in this economic arena!" + } + { + name: 'Dungeon Arena' + difficulty: 3 + id: 'dungeon-arena' + image: '/file/db/level/53173f76c269d400000543c2/Level%20Banner%20Dungeon%20Arena.jpg' + description: "Play head-to-head against fellow Wizards in a dungeon melee!" + } + { + name: 'Gold Rush' + difficulty: 3 + id: 'gold-rush' + image: '/file/db/level/533353722a61b7ca6832840c/Gold-Rush.png' + description: "Prove you are better at collecting gold than your opponent!" + } + { + name: 'Brawlwood' + difficulty: 4 + id: 'brawlwood' + image: '/file/db/level/52d97ecd32362bc86e004e87/Level%20Banner%20Brawlwood.jpg' + description: "Combat the armies of other Wizards in a strategic forest arena! (Fast computer required.)" + } + ] + + context.campaigns = [ + {id: "multiplayer", name: "Multiplayer Arenas", description: "... in which you code head-to-head against other players.", levels: arenas} + ] + context.levelStatusMap = @levelStatusMap + context + + afterRender: -> + super() + @$el.find('.modal').on 'shown.bs.modal', -> + $('input:visible:first', @).focus() diff --git a/app/views/play_view.coffee b/app/views/play_view.coffee index 63fd25f36..8662ecef4 100644 --- a/app/views/play_view.coffee +++ b/app/views/play_view.coffee @@ -143,6 +143,14 @@ module.exports = class PlayView extends View ] arenas = [ + { + name: 'Greed' + difficulty: 4 + id: 'greed' + image: '/file/db/level/526fd3043c637ece50001bb2/the_herd_icon.png' + description: "Liked Dungeon Arena and Gold Rush? Put them together in this economic arena!" + levelPath: 'ladder' + } { name: 'Dungeon Arena' difficulty: 3 @@ -159,14 +167,6 @@ module.exports = class PlayView extends View description: "Prove you are better at collecting gold than your opponent!" levelPath: 'ladder' } - { - name: 'Greed' - difficulty: 4 - id: 'greed' - image: '/file/db/level/526fd3043c637ece50001bb2/the_herd_icon.png' - description: "Liked Dungeon Arena and Gold Rush? Put them together in this economic arena!" - levelPath: 'ladder' - } { name: 'Brawlwood' difficulty: 4