2014-01-03 13:32:13 -05:00
|
|
|
# A root view is one that replaces everything else on the screen when it
|
|
|
|
# comes into being, as opposed to sub-views which get inserted into other views.
|
|
|
|
|
|
|
|
CocoView = require './CocoView'
|
|
|
|
|
2014-11-28 20:49:41 -05:00
|
|
|
{logoutUser, me} = require('core/auth')
|
2014-01-03 13:32:13 -05:00
|
|
|
locale = require 'locale/locale'
|
|
|
|
|
2014-08-15 13:27:36 -04:00
|
|
|
Achievement = require 'models/Achievement'
|
2014-11-28 20:49:41 -05:00
|
|
|
AchievementPopup = require 'views/core/AchievementPopup'
|
|
|
|
utils = require 'core/utils'
|
2014-07-30 16:23:43 -04:00
|
|
|
|
2014-05-29 05:10:57 -04:00
|
|
|
# TODO remove
|
2014-05-24 14:45:53 -04:00
|
|
|
|
2014-01-03 13:32:13 -05:00
|
|
|
filterKeyboardEvents = (allowedEvents, func) ->
|
|
|
|
return (splat...) ->
|
|
|
|
e = splat[0]
|
|
|
|
return unless e.keyCode in allowedEvents or not e.keyCode
|
|
|
|
return func(splat...)
|
|
|
|
|
|
|
|
module.exports = class RootView extends CocoView
|
2014-07-17 12:22:52 -04:00
|
|
|
showBackground: true
|
2014-08-15 13:27:36 -04:00
|
|
|
|
2014-01-03 13:32:13 -05:00
|
|
|
events:
|
2014-06-30 22:16:26 -04:00
|
|
|
'click #logout-button': 'logoutAccount'
|
2014-02-22 21:06:37 -05:00
|
|
|
'change .language-dropdown': 'onLanguageChanged'
|
2014-02-20 16:19:49 -05:00
|
|
|
'click .toggle-fullscreen': 'toggleFullscreen'
|
2014-11-22 20:38:01 -05:00
|
|
|
'click .signup-button': 'onClickSignupButton'
|
|
|
|
'click .login-button': 'onClickLoginButton'
|
2014-10-21 19:49:25 -04:00
|
|
|
'click a': 'onClickAnchor'
|
2014-06-13 16:35:57 -04:00
|
|
|
'click button': 'toggleModal'
|
|
|
|
'click li': 'toggleModal'
|
2014-01-06 19:58:50 -05:00
|
|
|
|
2014-05-24 14:45:53 -04:00
|
|
|
subscriptions:
|
|
|
|
'achievements:new': 'handleNewAchievements'
|
2014-11-21 19:23:26 -05:00
|
|
|
'modal:open-modal-view': 'onOpenModalView'
|
2014-05-24 14:45:53 -04:00
|
|
|
|
2014-06-17 15:42:27 -04:00
|
|
|
showNewAchievement: (achievement, earnedAchievement) ->
|
2014-11-12 17:40:01 -05:00
|
|
|
return if achievement.get('collection') is 'level.sessions'
|
2014-08-11 08:11:26 -04:00
|
|
|
popup = new AchievementPopup achievement: achievement, earnedAchievement: earnedAchievement
|
2014-05-24 14:45:53 -04:00
|
|
|
|
2014-08-27 15:24:03 -04:00
|
|
|
handleNewAchievements: (e) ->
|
|
|
|
_.each e.earnedAchievements.models, (earnedAchievement) =>
|
2014-05-26 12:21:56 -04:00
|
|
|
achievement = new Achievement(_id: earnedAchievement.get('achievement'))
|
2014-07-30 16:23:43 -04:00
|
|
|
achievement.fetch
|
2014-06-17 15:42:27 -04:00
|
|
|
success: (achievement) => @showNewAchievement(achievement, earnedAchievement)
|
2014-05-24 14:45:53 -04:00
|
|
|
|
2014-01-03 13:32:13 -05:00
|
|
|
logoutAccount: ->
|
2014-11-30 16:23:08 -05:00
|
|
|
Backbone.Mediator.publish("auth:logging-out", {})
|
2014-11-28 15:05:34 -05:00
|
|
|
window.tracker?.trackEvent 'Log Out', category:'Homepage', ['Google Analytics'] if @id is 'home-view'
|
2014-01-03 13:32:13 -05:00
|
|
|
logoutUser($('#login-email').val())
|
|
|
|
|
2014-11-22 20:38:01 -05:00
|
|
|
onClickSignupButton: ->
|
2014-11-29 11:54:08 -05:00
|
|
|
AuthModal = require 'views/core/AuthModal'
|
2014-12-08 01:44:20 -05:00
|
|
|
switch @id
|
|
|
|
when 'home-view'
|
|
|
|
window.tracker?.trackEvent 'Started Signup', category: 'Homepage', label: 'Homepage'
|
|
|
|
window.tracker?.trackPageView "signup/homepage", ['Google Analytics']
|
|
|
|
when 'world-map-view'
|
|
|
|
# TODO: add campaign data
|
|
|
|
window.tracker?.trackEvent 'Started Signup', category: 'World Map', label: 'World Map'
|
|
|
|
window.tracker?.trackPageView "signup/world-map", ['Google Analytics']
|
|
|
|
else
|
|
|
|
window.tracker?.trackEvent 'Started Signup', label: 'unknown'
|
|
|
|
window.tracker?.trackPageView "signup/unknown", ['Google Analytics']
|
2014-11-22 20:38:01 -05:00
|
|
|
@openModalView new AuthModal {mode: 'signup'}
|
2014-11-30 16:23:08 -05:00
|
|
|
|
2014-11-22 20:38:01 -05:00
|
|
|
onClickLoginButton: ->
|
2014-11-29 11:54:08 -05:00
|
|
|
AuthModal = require 'views/core/AuthModal'
|
2014-11-28 15:05:34 -05:00
|
|
|
window.tracker?.trackEvent 'Login', category: 'Homepage', ['Google Analytics'] if @id is 'home-view'
|
2014-11-22 20:38:01 -05:00
|
|
|
@openModalView new AuthModal {mode: 'login'}
|
2014-11-30 16:23:08 -05:00
|
|
|
|
2014-10-21 19:49:25 -04:00
|
|
|
onClickAnchor: (e) ->
|
2014-11-10 00:27:03 -05:00
|
|
|
return if @destroyed
|
2014-10-21 19:49:25 -04:00
|
|
|
anchorText = e?.currentTarget?.text
|
2014-11-28 15:05:34 -05:00
|
|
|
window.tracker?.trackEvent anchorText, category: 'Homepage', ['Google Analytics'] if @id is 'home-view' and anchorText
|
2014-10-21 19:49:25 -04:00
|
|
|
@toggleModal e
|
|
|
|
|
2014-11-21 19:23:26 -05:00
|
|
|
onOpenModalView: (e) ->
|
|
|
|
return console.error "Couldn't find modalPath #{e.modalPath}" unless e.modalPath and ModalClass = require e.modalPath
|
|
|
|
@openModalView new ModalClass {}
|
|
|
|
|
2014-01-03 13:32:13 -05:00
|
|
|
showLoading: ($el) ->
|
2014-11-25 14:06:34 -05:00
|
|
|
$el ?= @$el.find('#site-content-area')
|
2014-01-03 13:32:13 -05:00
|
|
|
super($el)
|
|
|
|
|
|
|
|
afterInsert: ->
|
|
|
|
# force the browser to scroll to the hash
|
|
|
|
# also messes with the browser history, so perhaps come up with a better solution
|
|
|
|
super()
|
2014-05-08 14:58:44 -04:00
|
|
|
#hash = location.hash
|
|
|
|
#location.hash = ''
|
|
|
|
#location.hash = hash
|
2014-04-07 17:34:36 -04:00
|
|
|
@renderScrollbar()
|
2014-03-21 01:00:34 -04:00
|
|
|
|
2014-07-17 12:22:52 -04:00
|
|
|
getRenderData: ->
|
|
|
|
c = super()
|
2014-10-15 16:43:26 -04:00
|
|
|
c.usesSocialMedia = @usesSocialMedia
|
2014-07-17 12:22:52 -04:00
|
|
|
c
|
2014-08-15 13:27:36 -04:00
|
|
|
|
2014-03-03 16:21:05 -05:00
|
|
|
afterRender: ->
|
2014-11-22 20:38:01 -05:00
|
|
|
if @$el.find('#site-nav').length # hack...
|
|
|
|
@$el.addClass('site-chrome')
|
|
|
|
if @showBackground
|
|
|
|
@$el.addClass('show-background')
|
2014-11-30 16:23:08 -05:00
|
|
|
|
2014-03-03 16:21:05 -05:00
|
|
|
super(arguments...)
|
2014-06-30 22:16:26 -04:00
|
|
|
@chooseTab(location.hash.replace('#', '')) if location.hash
|
2014-04-12 15:35:45 -04:00
|
|
|
@buildLanguages()
|
2014-04-11 19:15:26 -04:00
|
|
|
$('body').removeClass('is-playing')
|
2014-01-03 13:32:13 -05:00
|
|
|
|
2014-10-03 13:45:01 -04:00
|
|
|
if application.isProduction()
|
|
|
|
title = 'CodeCombat - ' + (@getTitle() or 'Learn how to code by playing a game')
|
|
|
|
else
|
|
|
|
title = @getTitle() or @constructor.name
|
|
|
|
|
|
|
|
$('title').text(title)
|
|
|
|
|
|
|
|
getTitle: -> ''
|
|
|
|
|
2014-03-03 16:21:05 -05:00
|
|
|
chooseTab: (category) ->
|
|
|
|
$("a[href='##{category}']", @$el).tab('show')
|
|
|
|
|
|
|
|
# TODO: automate tabs to put in hashes when they are clicked
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
buildLanguages: ->
|
2014-06-30 22:16:26 -04:00
|
|
|
$select = @$el.find('.language-dropdown').empty()
|
2014-08-23 18:51:59 -04:00
|
|
|
preferred = me.get('preferredLanguage', true)
|
2014-10-27 20:11:48 -04:00
|
|
|
@addLanguagesToSelect($select, preferred)
|
|
|
|
$('body').attr('lang', preferred)
|
2014-11-10 00:27:03 -05:00
|
|
|
|
2014-10-27 20:11:48 -04:00
|
|
|
addLanguagesToSelect: ($select, initialVal) ->
|
|
|
|
initialVal ?= me.get('preferredLanguage', true)
|
2014-01-03 13:32:13 -05:00
|
|
|
codes = _.keys(locale)
|
|
|
|
genericCodes = _.filter codes, (code) ->
|
|
|
|
_.find(codes, (code2) ->
|
|
|
|
code2 isnt code and code2.split('-')[0] is code)
|
2014-10-27 20:11:48 -04:00
|
|
|
for code, localeInfo of locale when not (code in genericCodes) or code is initialVal
|
2014-01-03 13:32:13 -05:00
|
|
|
$select.append(
|
2014-06-30 22:16:26 -04:00
|
|
|
$('<option></option>').val(code).text(localeInfo.nativeDescription))
|
2014-10-27 20:11:48 -04:00
|
|
|
$select.val(initialVal)
|
2014-01-03 13:32:13 -05:00
|
|
|
|
2014-02-22 21:06:37 -05:00
|
|
|
onLanguageChanged: ->
|
2014-06-30 22:16:26 -04:00
|
|
|
newLang = $('.language-dropdown').val()
|
2014-01-03 13:32:13 -05:00
|
|
|
$.i18n.setLng(newLang, {})
|
|
|
|
@saveLanguage(newLang)
|
2014-11-30 16:23:08 -05:00
|
|
|
|
2014-11-28 19:38:50 -05:00
|
|
|
loading = application.moduleLoader.loadLanguage(me.get('preferredLanguage', true))
|
|
|
|
if loading
|
|
|
|
@listenToOnce application.moduleLoader, 'load-complete', @onLanguageLoaded
|
|
|
|
else
|
|
|
|
@onLanguageLoaded()
|
2014-11-30 16:23:08 -05:00
|
|
|
|
2014-11-28 19:38:50 -05:00
|
|
|
onLanguageLoaded: ->
|
2014-01-03 13:32:13 -05:00
|
|
|
@render()
|
2014-11-28 19:38:50 -05:00
|
|
|
unless me.get('preferredLanguage').split('-')[0] is 'en'
|
2014-11-28 20:49:41 -05:00
|
|
|
DiplomatModal = require 'views/core/DiplomatSuggestionModal'
|
2014-07-23 10:02:45 -04:00
|
|
|
@openModalView(new DiplomatModal())
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
saveLanguage: (newLang) ->
|
|
|
|
me.set('preferredLanguage', newLang)
|
2014-06-11 16:16:17 -04:00
|
|
|
res = me.patch()
|
2014-01-03 13:32:13 -05:00
|
|
|
return unless res
|
|
|
|
res.error ->
|
|
|
|
errors = JSON.parse(res.responseText)
|
2014-06-30 22:16:26 -04:00
|
|
|
console.warn 'Error saving language:', errors
|
2014-01-03 13:32:13 -05:00
|
|
|
res.success (model, response, options) ->
|
2014-06-30 22:16:26 -04:00
|
|
|
#console.log 'Saved language:', newLang
|