diff --git a/app/Router.coffee b/app/Router.coffee index cffcab045..aa273795f 100644 --- a/app/Router.coffee +++ b/app/Router.coffee @@ -74,8 +74,9 @@ module.exports = class CocoRouter extends Backbone.Router 'multiplayer': go('MultiplayerView') - 'play': go('play/MainPlayView') # This will become 'play-old' or something. - 'play-hero': go('play/WorldMapView') # This will become 'play' when it is done. + 'play-old': go('play/MainPlayView') # This used to be 'play'. + 'play': go('play/WorldMapView') + 'play-hero': go('play/WorldMapView') # Legacy URL for /play; leave up until start of 2015, I guess. 'play/ladder/:levelID': go('play/ladder/LadderView') 'play/ladder': go('play/ladder/MainLadderView') 'play/level/:levelID': go('play/level/PlayLevelView') diff --git a/app/assets/images/pages/home/play_img.png b/app/assets/images/pages/home/play_img.png new file mode 100644 index 000000000..ffdad8dca Binary files /dev/null and b/app/assets/images/pages/home/play_img.png differ diff --git a/app/lib/surface/Surface.coffee b/app/lib/surface/Surface.coffee index 3a608a045..78a8f4c39 100644 --- a/app/lib/surface/Surface.coffee +++ b/app/lib/surface/Surface.coffee @@ -142,10 +142,8 @@ module.exports = Surface = class Surface extends CocoClass setWorld: (@world) -> @worldLoaded = true - lastFrame = Math.min(@getCurrentFrame(), @world.frames.length - 1) - @world.getFrame(lastFrame).restoreState() unless @options.choosing @spriteBoss.world = @world - + @restoreWorldState() unless @options.choosing @showLevel() @updateState true if @loaded @onFrameChanged() diff --git a/app/locale/en.coffee b/app/locale/en.coffee index 072dc62ec..8a17c58d5 100644 --- a/app/locale/en.coffee +++ b/app/locale/en.coffee @@ -117,6 +117,7 @@ adventurer_forum: "the Adventurer forum" adventurer_suffix: "." campaign_beginner: "Beginner Campaign" + campaign_old_beginner: "Old Beginner Campaign" campaign_beginner_description: "... in which you learn the wizardry of programming." campaign_dev: "Random Harder Levels" campaign_dev_description: "... in which you learn the interface while doing something a little harder." @@ -139,6 +140,7 @@ next: "Next" previous: "Previous" choose_inventory: "Equip Items" + older_campaigns: "Older Campaigns" items: armor: "Armor" diff --git a/app/styles/common/top_nav.sass b/app/styles/common/top_nav.sass index f63c32476..25d2d9adf 100644 --- a/app/styles/common/top_nav.sass +++ b/app/styles/common/top_nav.sass @@ -196,7 +196,7 @@ a.disabled .navbar-toggle display: none -@media only screen and (max-width: 800px) +@media only screen and (max-width: 768px) #top-nav display: inline button.navbar-toggle diff --git a/app/styles/home.sass b/app/styles/home.sass index c41497a2d..457d97b72 100644 --- a/app/styles/home.sass +++ b/app/styles/home.sass @@ -15,6 +15,7 @@ display: block margin: 0 auto @include transition(box-shadow .50s ease-in-out) + border-radius: 11px text-shadow: 2px 2px 5px black @@ -62,176 +63,12 @@ &.inverted filter: invert(100%) -webkit-filter: invert(100%) - - .code-languages - margin: 10px 0 30px 0 - - &:hover - .code-language - opacity: 0.6 - - .code-language.selected-language:not(:hover) - opacity: 0.8 - - h2, h3 - text-shadow: none - - .code-wizard - opacity: 0.5 - - .language-play-count - text-transform: lowercase - position: absolute - left: 0 - top: 0 - - .code-language - cursor: pointer - text-align: center - position: relative - opacity: 0.6 - - &:hover - opacity: 1 - - h2, h3 - text-shadow: 0px 0px 5px white - - .code-wizard - display: block - opacity: 1 - - &.selected-language - opacity: 1 - - h2, h3 - text-shadow: 0px 0px 5px white - - .code-wizard - display: block - - .code-wizard - position: absolute - background: transparent url(/images/pages/home/wizard.png) no-repeat - background-size: contain - width: 111px - height: 97px - display: none - - .code-language-beta - background: transparent url(/images/pages/home/language_beta_sticker.png) no-repeat - background-size: contain - width: 100px - height: 32px - position: absolute - right: 20px - top: -7px - - .primary-code-languages - - #javascript - background: transparent url(/images/pages/home/language_js.png) no-repeat - padding-right: 150px - - .language-play-count - right: -100px - .code-wizard - left: 120px - - #python - background: transparent url(/images/pages/home/language_python.png) no-repeat - padding-left: 150px - - .language-play-count - left: 125px - .code-wizard - right: 120px - - .code-language - width: 498px - height: 153px - padding: 30px - margin: 0px 0 0 -6px - - .code-wizard - top: -65px - - h2 - margin: 15px 0 5px - - p - overflow: hidden - height: 40px - - .secondary-code-languages - margin-left: -10px - - .col-md-3 - padding: 0px - - .language-play-count - left: 15px - top: -15px - - .code-language - background: transparent url(/images/pages/home/language_background_small.png) no-repeat - width: 250px - height: 80px - margin: 20px 0 20px 0 - padding: 20px 20px 20px 70px - - .code-wizard - top: -51px - left: 89px - height: 63px - - .code-language-logo - position: absolute - left: 15px - top: 17px - width: 50px - height: 50px - - .code-language-beta - right: -15px - top: -16px - height: 24px - - h3 - margin: 0 - padding: 0 - - p - white-space: nowrap - text-overflow: ellipsis - overflow: hidden - - #coffeescript .code-language-logo - background: transparent url(/images/common/code_languages/coffeescript_small.png) no-repeat center - - #clojure .code-language-logo - background: transparent url(/images/common/code_languages/clojure_small.png) no-repeat center - - #lua .code-language-logo - background: transparent url(/images/common/code_languages/lua_small.png) no-repeat center - - #io .code-language-logo - background: transparent url(/images/common/code_languages/io_small.png) no-repeat center - -#mobile-trailer-wrapper - display: none - -@media only screen and (max-width: 800px) +@media only screen and (max-width: 768px) #home-view #site-slogan font-size: 30px margin-bottom: 30px - .code-languages - .col-sm-6, .col-sm-3 - margin-top: 30px - .code-language - margin: 0px auto .game-mode-wrapper width: 100% img @@ -244,9 +81,6 @@ font-size: 50px font-family: Bangers @include transition(color .10s linear) - .code-language-logo - right: 0px - top: 5px h1 text-align: center diff --git a/app/styles/play/world-map-view.sass b/app/styles/play/world-map-view.sass index cf25d0606..47a554779 100644 --- a/app/styles/play/world-map-view.sass +++ b/app/styles/play/world-map-view.sass @@ -180,3 +180,17 @@ $gameControlMargin: 30px .tooltip font-size: 24px + + .old-levels + position: absolute + bottom: 1% + left: 1% + z-index: 3 + + a + font-size: 20px + color: #eee + text-decoration: underline + + &:hover + color: white diff --git a/app/templates/base.jade b/app/templates/base.jade index fef1eb980..69cc3ca41 100644 --- a/app/templates/base.jade +++ b/app/templates/base.jade @@ -14,10 +14,6 @@ body img(src="/images/pages/base/logo.png", title="CodeCombat - Learn how to code by playing a game", alt="CodeCombat") ul(class='navbar-link-text').nav.navbar-nav.navbar-collapse.collapse - li.play - a.header-font(href='/play', data-i18n="nav.play") Levels - li - a.header-font(href='/community', data-i18n="nav.community") Community if me.get('anonymous') === false li.dropdown button.btn.btn-primary.navbuttontext.header-font.dropdown-toggle(href="#", data-toggle="dropdown") @@ -68,12 +64,14 @@ body .content p.footer-link-text if pathname == "/" || (me.get('permissions', true)).indexOf('employer') != -1 - a(href='/employers', title='Home', tabindex=-1, data-i18n="nav.employers") Employers + a(href='/employers', tabindex=-1, data-i18n="nav.employers") Employers else - a(href='/', title='Home', tabindex=-1, data-i18n="nav.home") Home - a(href='/contribute', title='Contribute', tabindex=-1, data-i18n="nav.contribute") Contribute - a(href='/legal', title='Legal', tabindex=-1, data-i18n="nav.legal") Legal - a(href='/about', title='About', tabindex=-1, data-i18n="nav.about") About + a(href='/', tabindex=-1, data-i18n="nav.home") Home + a(href='/play/ladder', tabindex=-1, data-i18n="home.multiplayer") Multiplayer + a(href='/community', tabindex=-1, data-i18n="nav.community") Community + a(href='/contribute', tabindex=-1, data-i18n="nav.contribute") Contribute + a(href='/legal', tabindex=-1, data-i18n="nav.legal") Legal + a(href='/about', tabindex=-1, data-i18n="nav.about") About a(title='Contact', tabindex=-1, data-toggle="coco-modal", data-target="modal/ContactModal", data-i18n="nav.contact") Contact a(href='http://blog.codecombat.com/', data-i18n="nav.blog") Blog a(href='http://discourse.codecombat.com/', data-i18n="nav.forum") Forum diff --git a/app/templates/home.jade b/app/templates/home.jade index 16698fb66..4a4ab5426 100644 --- a/app/templates/home.jade +++ b/app/templates/home.jade @@ -4,84 +4,6 @@ block content h1#site-slogan(data-i18n="home.slogan") Learn to Code by Playing a Game - .code-languages - .primary-code-languages.row - .col-sm-6 - .code-language#javascript(data-code-language='javascript') - .code-wizard - h2 JavaScript - p(data-i18n="home.javascript_blurb") The language of the web. Great for writing websites, web apps, HTML5 games, and servers. - - var playCount = codeLanguageCountMap.javascript - if playCount - div.language-play-count - span.spr= playCount - span(data-i18n="resources.sessions") sessions - - .col-sm-6 - .code-language.beta#python(data-code-language='python') - .code-wizard - .code-language-beta - h2 Python - p(data-i18n="home.python_blurb") Simple yet powerful, Python is a great general purpose programming language. - - var playCount = codeLanguageCountMap.python - if playCount - div.language-play-count - span.spr= playCount - span(data-i18n="resources.sessions") sessions - - .secondary-code-languages.row - .col-sm-3 - .code-language.beta#coffeescript(data-code-language='coffeescript') - .code-language-logo - .code-wizard - .code-language-beta - h3 CoffeeScript - p(data-i18n="home.coffeescript_blurb") Nicer JavaScript syntax. - - var playCount = codeLanguageCountMap.coffeescript - if playCount - div.language-play-count - span.spr= playCount - span(data-i18n="resources.sessions") sessions - - .col-sm-3 - .code-language.beta#clojure(data-code-language='clojure') - .code-language-logo - .code-wizard - .code-language-beta - h3 Clojure - p(data-i18n="home.clojure_blurb") A modern Lisp. - - var playCount = codeLanguageCountMap.clojure - if playCount - div.language-play-count - span.spr= playCount - span(data-i18n="resources.sessions") sessions - - .col-sm-3 - .code-language.beta#lua(data-code-language='lua') - .code-language-logo - .code-wizard - .code-language-beta - h3 Lua - p(data-i18n="home.lua_blurb") Game scripting language. - - var playCount = codeLanguageCountMap.lua - if playCount - div.language-play-count - span.spr= playCount - span(data-i18n="resources.sessions") sessions - - .col-sm-3 - .code-language.beta#io(data-code-language='io', title="Careful: Io is still quite buggy") - .code-language-logo - .code-wizard - .code-language-beta - h3 Io - p(data-i18n="home.io_blurb") Simple but obscure. - - var playCount = codeLanguageCountMap.io - if playCount - div.language-play-count - span.spr= playCount - span(data-i18n="resources.sessions") sessions - .alert.alert-danger.lt-ie10 strong(data-i18n="home.no_ie") CodeCombat does not run in Internet Explorer 9 or older. Sorry! @@ -94,26 +16,11 @@ block content br span(data-i18n="home.old_browser_suffix") You can try anyway, but it probably won't work. - a#beginner-campaign(href="/play/level/rescue-mission") + a#beginner-campaign(href="/play") div.game-mode-wrapper - if isEnglish - img(src="/images/pages/home/campaign.jpg").img-rounded - else - img(src="/images/pages/home/campaign_notext.jpg").img-rounded - h3(data-i18n="home.campaign") Campaign - h4(data-i18n="home.for_beginners") For Beginners + img(src="/images/pages/home/play_img.png").img-rounded + h3(data-i18n="home.campaign") Campaign + h4(data-i18n="home.for_beginners") For Beginners .play-text(data-i18n="home.play") Play - .code-language-logo - - a#multiplayer(href="/play/ladder") - div.game-mode-wrapper - if isEnglish - img(src="/images/pages/home/multiplayer.jpg").img-rounded - else - img(src="/images/pages/home/multiplayer_notext.jpg").img-rounded - h3(data-i18n="home.multiplayer") Multiplayer - h4(data-i18n="home.for_developers") For Developers - .play-text(data-i18n="home.play") Play - .code-language-logo .clearfix diff --git a/app/templates/play/world-map-view.jade b/app/templates/play/world-map-view.jade index 899dc727a..1d3330259 100644 --- a/app/templates/play/world-map-view.jade +++ b/app/templates/play/world-map-view.jade @@ -34,3 +34,6 @@ button.btn.achievements(data-toggle='coco-modal', data-target='play/modal/PlayAchievementsModal', data-i18n="[title]play.achievements") button.btn.account(data-toggle='coco-modal', data-target='play/modal/PlayAccountModal', data-i18n="[title]play.account") button.btn.settings(data-toggle='coco-modal', data-target='play/modal/PlaySettingsModal', data-i18n="[title]play.settings") + +.old-levels + a(href="/play-old", data-i18n="play.older_campaigns").header-font Older Campaigns diff --git a/app/views/HomeView.coffee b/app/views/HomeView.coffee index f51adecdf..0591310e7 100644 --- a/app/views/HomeView.coffee +++ b/app/views/HomeView.coffee @@ -10,12 +10,7 @@ module.exports = class HomeView extends RootView template: template events: - 'click .code-language': 'onCodeLanguageSelected' - - constructor: -> - super(arguments...) - ThangType.loadUniversalWizard() - @getCodeLanguageCounts() + 'click #beginner-campaign': 'onClickBeginnerCampaign' getRenderData: -> c = super() @@ -28,61 +23,9 @@ module.exports = class HomeView extends RootView console.warn 'no more jquery browser version...' c.isEnglish = (me.get('preferredLanguage') or 'en').startsWith 'en' c.languageName = me.get('preferredLanguage') - c.codeLanguage = (me.get('aceConfig') ? {}).language or 'python' - c.codeLanguageCountMap = @codeLanguageCountMap c - afterRender: -> - super() - @$el.find('.modal').on 'shown.bs.modal', -> - $('input:visible:first', @).focus() - - # Try to find latest level and set 'Play' link to go to that level - lastLevel = me.get('lastLevel') - lastLevel ?= localStorage?['lastLevel'] # Temp, until it's migrated to user property - if lastLevel - playLink = @$el.find('#beginner-campaign') - if playLink[0]? - href = playLink.attr('href').split('/') - href[href.length-1] = lastLevel if href.length isnt 0 - href = href.join('/') - playLink.attr('href', href) - - codeLanguage = (me.get('aceConfig') ? {}).language or 'python' - @$el.find(".code-language[data-code-language=#{codeLanguage}]").addClass 'selected-language' - @updateLanguageLogos codeLanguage - - updateLanguageLogos: (codeLanguage) -> - @$el.find('.game-mode-wrapper .code-language-logo').css('background-image', "url(/images/common/code_languages/#{codeLanguage}_small.png)") - - onCodeLanguageSelected: (e) -> - target = $(e.target).closest('.code-language') - codeLanguage = target.data('code-language') - @$el.find('.code-language').removeClass 'selected-language' - target.addClass 'selected-language' - aceConfig = me.get('aceConfig') ? {} - return if (aceConfig.language or 'python') is codeLanguage - aceConfig.language = codeLanguage - me.set 'aceConfig', aceConfig - me.save() # me.patch() doesn't work if aceConfig previously existed and we switched just once - - firstButton = @$el.find('#beginner-campaign .game-mode-wrapper').delay(500).addClass('hovered', 500).delay(500).removeClass('hovered', 500) - lastButton = @$el.find('#multiplayer .game-mode-wrapper').delay(1000).addClass('hovered', 500).delay(500).removeClass('hovered', 500) - $('#page-container').animate {scrollTop: firstButton.offset().top - 100, easing: 'easeInOutCubic'}, 500 - @updateLanguageLogos codeLanguage - - getCodeLanguageCounts: -> - @codeLanguageCountMap = {} - success = (codeLanguageCounts) => - return if @destroyed - for codeLanguage in codeLanguageCounts - @codeLanguageCountMap[codeLanguage._id] = codeLanguage.sessions - @codeLanguageCountMap.javascript += @codeLanguageCountMap[null] - @render() if @supermodel.finished() - - codeLanguageCountsRequest = @supermodel.addRequestResource 'play_counts', { - url: '/db/level.session/-/code_language_counts' - method: 'POST' - success: success - }, 0 - codeLanguageCountsRequest.load() + onClickBeginnerCampaign: (e) -> + e.preventDefault() + e.stopImmediatePropagation() + window.open '/play', '_blank' diff --git a/app/views/modal/AuthModal.coffee b/app/views/modal/AuthModal.coffee index 251a45a8a..8a9a87c05 100644 --- a/app/views/modal/AuthModal.coffee +++ b/app/views/modal/AuthModal.coffee @@ -43,6 +43,7 @@ module.exports = class AuthModal extends ModalView afterInsert: -> super() _.delay application.router.renderLoginButtons, 500 + _.delay (=> $('input:visible:first', @$el).focus()), 500 onSignupInstead: (e) -> @mode = 'signup' diff --git a/app/views/play/MainPlayView.coffee b/app/views/play/MainPlayView.coffee index 34a27341c..98e886dca 100644 --- a/app/views/play/MainPlayView.coffee +++ b/app/views/play/MainPlayView.coffee @@ -54,11 +54,6 @@ module.exports = class MainPlayView extends RootView context.levelPlayCountMap = @levelPlayCountMap context - afterRender: -> - super() - @$el.find('.modal').on 'shown.bs.modal', -> - $('input:visible:first', @).focus() - tutorials = [ { @@ -327,7 +322,7 @@ playerCreated = [ ] campaigns = [ - {id: 'beginner', name: 'Beginner Campaign', description: '... in which you learn the wizardry of programming.', levels: tutorials} + {id: 'old_beginner', name: 'Old Beginner Campaign', description: '... in which you learn the wizardry of programming.', levels: tutorials} {id: 'multiplayer', name: 'Multiplayer Arenas', description: '... in which you code head-to-head against other players.', levels: arenas} {id: 'dev', name: 'Random Harder Levels', description: '... in which you learn the interface while doing something a little harder.', levels: experienced} {id: 'classic' ,name: 'Classic Algorithms', description: '... in which you learn the most popular algorithms in Computer Science.', levels: classicAlgorithms} diff --git a/app/views/play/ladder/MainLadderView.coffee b/app/views/play/ladder/MainLadderView.coffee index 00907172c..88902e227 100644 --- a/app/views/play/ladder/MainLadderView.coffee +++ b/app/views/play/ladder/MainLadderView.coffee @@ -54,11 +54,6 @@ module.exports = class LadderHomeView extends RootView context.campaigns = campaigns context - afterRender: -> - super() - @$el.find('.modal').on 'shown.bs.modal', -> - $('input:visible:first', @).focus() - arenas = [ { diff --git a/app/views/play/level/ControlBarView.coffee b/app/views/play/level/ControlBarView.coffee index df4d83a05..5cfaf2922 100644 --- a/app/views/play/level/ControlBarView.coffee +++ b/app/views/play/level/ControlBarView.coffee @@ -60,7 +60,7 @@ module.exports = class ControlBarView extends CocoView @homeViewClass = require 'views/play/ladder/LadderView' @homeViewArgs.push levelID else if @level.get('type', true) is 'hero' - @homeLink = c.homeLink = '/play-hero' + @homeLink = c.homeLink = '/play' @homeViewClass = require 'views/play/WorldMapView' else @homeLink = c.homeLink = '/' diff --git a/app/views/play/level/modal/VictoryModal.coffee b/app/views/play/level/modal/VictoryModal.coffee index 88769919e..d0444fbf4 100644 --- a/app/views/play/level/modal/VictoryModal.coffee +++ b/app/views/play/level/modal/VictoryModal.coffee @@ -68,7 +68,7 @@ module.exports = class VictoryModal extends ModalView onClickWorldMap: (e) -> e.preventDefault() e.stopImmediatePropagation() - Backbone.Mediator.publish 'router:navigate', route: '/play-hero', viewClass: require('views/play/WorldMapView'), viewArgs: [{supermodel: @supermodel}] + Backbone.Mediator.publish 'router:navigate', route: '/play', viewClass: require('views/play/WorldMapView'), viewArgs: [{supermodel: @supermodel}] onGameSubmitted: (e) -> ladderURL = "/play/ladder/#{@level.get('slug')}#my-matches"