2015-09-10 13:37:32 -04:00
|
|
|
app = require 'core/application'
|
2015-10-09 12:32:46 -04:00
|
|
|
AuthModal = require 'views/core/AuthModal'
|
2015-09-10 13:37:32 -04:00
|
|
|
RootView = require 'views/core/RootView'
|
2015-11-03 19:41:06 -05:00
|
|
|
template = require 'templates/courses/courses-view'
|
2015-11-21 14:38:34 -05:00
|
|
|
StudentLogInModal = require 'views/courses/StudentLogInModal'
|
|
|
|
StudentSignUpModal = require 'views/courses/StudentSignUpModal'
|
2015-11-23 12:52:15 -05:00
|
|
|
ChangeCourseLanguageModal = require 'views/courses/ChangeCourseLanguageModal'
|
2015-11-29 18:41:57 -05:00
|
|
|
ChooseLanguageModal = require 'views/courses/ChooseLanguageModal'
|
2015-11-21 14:38:34 -05:00
|
|
|
CourseInstance = require 'models/CourseInstance'
|
2015-11-22 03:08:46 -05:00
|
|
|
CocoCollection = require 'collections/CocoCollection'
|
|
|
|
Course = require 'models/Course'
|
|
|
|
Classroom = require 'models/Classroom'
|
|
|
|
LevelSession = require 'models/LevelSession'
|
2015-11-23 11:46:08 -05:00
|
|
|
Campaign = require 'models/Campaign'
|
2015-11-29 18:13:23 -05:00
|
|
|
utils = require 'core/utils'
|
2015-11-23 11:46:08 -05:00
|
|
|
|
|
|
|
# TODO: Test everything
|
2015-10-12 19:25:23 -04:00
|
|
|
|
2015-08-29 10:15:35 -04:00
|
|
|
module.exports = class CoursesView extends RootView
|
|
|
|
id: 'courses-view'
|
|
|
|
template: template
|
2015-11-21 14:38:34 -05:00
|
|
|
|
|
|
|
events:
|
|
|
|
'click #log-in-btn': 'onClickLogInButton'
|
|
|
|
'click #start-new-game-btn': 'onClickStartNewGameButton'
|
2015-11-23 11:46:08 -05:00
|
|
|
'click #join-class-btn': 'onClickJoinClassButton'
|
|
|
|
'submit #join-class-form': 'onSubmitJoinClassForm'
|
2015-11-23 12:52:15 -05:00
|
|
|
'click #change-language-link': 'onClickChangeLanguageLink'
|
2015-12-04 15:08:08 -05:00
|
|
|
|
2015-11-22 03:08:46 -05:00
|
|
|
initialize: ->
|
|
|
|
@courseInstances = new CocoCollection([], { url: "/db/user/#{me.id}/course_instances", model: CourseInstance})
|
|
|
|
@courseInstances.comparator = (ci) -> return ci.get('classroomID') + ci.get('courseID')
|
2015-11-29 15:25:59 -05:00
|
|
|
@listenToOnce @courseInstances, 'sync', @onCourseInstancesLoaded
|
2016-01-25 19:52:14 -05:00
|
|
|
@supermodel.loadCollection(@courseInstances)
|
2015-11-22 03:08:46 -05:00
|
|
|
@classrooms = new CocoCollection([], { url: "/db/classroom", model: Classroom })
|
2016-01-25 19:52:14 -05:00
|
|
|
@supermodel.loadCollection(@classrooms, { data: {memberID: me.id} })
|
2015-11-22 03:08:46 -05:00
|
|
|
@courses = new CocoCollection([], { url: "/db/course", model: Course})
|
2016-01-25 19:52:14 -05:00
|
|
|
@supermodel.loadCollection(@courses)
|
2015-11-29 13:27:40 -05:00
|
|
|
@campaigns = new CocoCollection([], { url: "/db/campaign", model: Campaign })
|
2016-01-25 19:52:14 -05:00
|
|
|
@supermodel.loadCollection(@campaigns, { data: { type: 'course' }})
|
2015-11-23 11:46:08 -05:00
|
|
|
|
2015-11-29 15:25:59 -05:00
|
|
|
onCourseInstancesLoaded: ->
|
|
|
|
map = {}
|
2015-11-23 11:46:08 -05:00
|
|
|
for courseInstance in @courseInstances.models
|
2015-11-29 15:25:59 -05:00
|
|
|
courseID = courseInstance.get('courseID')
|
|
|
|
if map[courseID]
|
|
|
|
courseInstance.sessions = map[courseID]
|
|
|
|
continue
|
|
|
|
map[courseID] = courseInstance.sessions = new CocoCollection([], {
|
|
|
|
url: courseInstance.url() + '/my-course-level-sessions',
|
2015-12-04 15:08:08 -05:00
|
|
|
model: LevelSession
|
2015-11-29 15:25:59 -05:00
|
|
|
})
|
|
|
|
courseInstance.sessions.comparator = 'changed'
|
2016-01-25 19:52:14 -05:00
|
|
|
@supermodel.loadCollection(courseInstance.sessions, { data: { project: 'state.complete level.original playtime changed' }})
|
2015-12-04 15:08:08 -05:00
|
|
|
|
2015-11-22 03:08:46 -05:00
|
|
|
@hocCourseInstance = @courseInstances.findWhere({hourOfCode: true})
|
|
|
|
if @hocCourseInstance
|
|
|
|
@courseInstances.remove(@hocCourseInstance)
|
2015-12-04 15:08:08 -05:00
|
|
|
|
2015-11-29 18:13:23 -05:00
|
|
|
onLoaded: ->
|
2015-11-29 18:20:38 -05:00
|
|
|
super()
|
2015-11-29 18:13:23 -05:00
|
|
|
if utils.getQueryVariable('_cc', false)
|
|
|
|
@joinClass()
|
2015-11-29 15:25:59 -05:00
|
|
|
|
2015-11-21 14:38:34 -05:00
|
|
|
onClickStartNewGameButton: ->
|
2015-11-29 18:41:57 -05:00
|
|
|
if me.isAnonymous()
|
|
|
|
@openSignUpModal()
|
|
|
|
else
|
|
|
|
modal = new ChooseLanguageModal()
|
|
|
|
@openModalView(modal)
|
2015-12-04 15:08:08 -05:00
|
|
|
@listenToOnce modal, 'set-language', =>
|
|
|
|
@startHourOfCodePlay()
|
|
|
|
application.tracker?.trackEvent 'Automatic start hour of code play', category: 'Courses', label: 'set language'
|
|
|
|
application.tracker?.trackEvent 'Start New Game', category: 'Courses'
|
2015-11-21 14:38:34 -05:00
|
|
|
|
|
|
|
onClickLogInButton: ->
|
|
|
|
modal = new StudentLogInModal()
|
|
|
|
@openModalView(modal)
|
|
|
|
modal.on 'want-to-create-account', @openSignUpModal, @
|
2015-12-04 15:08:08 -05:00
|
|
|
application.tracker?.trackEvent 'Started Student Login', category: 'Courses'
|
2015-11-21 14:38:34 -05:00
|
|
|
|
|
|
|
openSignUpModal: ->
|
|
|
|
modal = new StudentSignUpModal({ willPlay: true })
|
|
|
|
@openModalView(modal)
|
2015-12-04 15:08:08 -05:00
|
|
|
modal.once 'click-skip-link', (=>
|
|
|
|
@startHourOfCodePlay()
|
|
|
|
application.tracker?.trackEvent 'Automatic start hour of code play', category: 'Courses', label: 'skip link'
|
|
|
|
), @
|
|
|
|
application.tracker?.trackEvent 'Started Student Signup', category: 'Courses'
|
2015-11-21 14:38:34 -05:00
|
|
|
|
|
|
|
startHourOfCodePlay: ->
|
|
|
|
@$('#main-content').hide()
|
|
|
|
@$('#begin-hoc-area').removeClass('hide')
|
|
|
|
hocCourseInstance = new CourseInstance()
|
|
|
|
hocCourseInstance.upsertForHOC()
|
|
|
|
@listenToOnce hocCourseInstance, 'sync', ->
|
|
|
|
url = hocCourseInstance.firstLevelURL()
|
|
|
|
app.router.navigate(url, { trigger: true })
|
2015-11-23 11:46:08 -05:00
|
|
|
|
|
|
|
onSubmitJoinClassForm: (e) ->
|
|
|
|
e.preventDefault()
|
|
|
|
@joinClass()
|
2015-12-04 15:08:08 -05:00
|
|
|
|
2015-11-23 11:46:08 -05:00
|
|
|
onClickJoinClassButton: (e) ->
|
|
|
|
@joinClass()
|
|
|
|
|
|
|
|
joinClass: ->
|
2015-11-29 18:13:23 -05:00
|
|
|
return if @state
|
2015-11-23 11:46:08 -05:00
|
|
|
@state = 'enrolling'
|
2015-11-29 18:13:23 -05:00
|
|
|
@errorMessage = null
|
|
|
|
@classCode = @$('#class-code-input').val() or utils.getQueryVariable('_cc', false)
|
|
|
|
if not @classCode
|
|
|
|
@state = null
|
|
|
|
@errorMessage = 'Please enter a code.'
|
|
|
|
@renderSelectors '#join-class-form'
|
|
|
|
return
|
|
|
|
@renderSelectors '#join-class-form'
|
2015-11-23 11:46:08 -05:00
|
|
|
newClassroom = new Classroom()
|
|
|
|
newClassroom.joinWithCode(@classCode)
|
|
|
|
newClassroom.on 'sync', @onJoinClassroomSuccess, @
|
|
|
|
newClassroom.on 'error', @onJoinClassroomError, @
|
|
|
|
|
|
|
|
onJoinClassroomError: (classroom, jqxhr, options) ->
|
2015-11-29 18:13:23 -05:00
|
|
|
@state = null
|
2015-12-04 15:08:08 -05:00
|
|
|
application.tracker?.trackEvent 'Failed to join classroom with code', category: 'Courses', status: jqxhr.status
|
2015-11-23 11:46:08 -05:00
|
|
|
if jqxhr.status is 422
|
|
|
|
@errorMessage = 'Please enter a code.'
|
|
|
|
else if jqxhr.status is 404
|
|
|
|
@errorMessage = 'Code not found.'
|
|
|
|
else
|
|
|
|
@errorMessage = "#{jqxhr.responseText}"
|
2015-12-04 15:08:08 -05:00
|
|
|
@renderSelectors '#join-class-form'
|
2015-11-23 11:46:08 -05:00
|
|
|
|
|
|
|
onJoinClassroomSuccess: (newClassroom, jqxhr, options) ->
|
|
|
|
application.tracker?.trackEvent 'Joined classroom', {
|
2015-12-04 15:08:08 -05:00
|
|
|
category: 'Courses'
|
|
|
|
classCode: @classCode
|
|
|
|
classroomID: newClassroom.id
|
2015-11-23 11:46:08 -05:00
|
|
|
classroomName: newClassroom.get('name')
|
|
|
|
ownerID: newClassroom.get('ownerID')
|
|
|
|
}
|
|
|
|
@classrooms.add(newClassroom)
|
|
|
|
@render()
|
2015-11-29 18:13:23 -05:00
|
|
|
@classroomJustAdded = newClassroom.id
|
2015-12-04 15:08:08 -05:00
|
|
|
|
2015-11-23 11:46:08 -05:00
|
|
|
classroomCourseInstances = new CocoCollection([], { url: "/db/course_instance", model: CourseInstance })
|
2015-11-29 18:13:23 -05:00
|
|
|
classroomCourseInstances.fetch({ data: {classroomID: newClassroom.id} })
|
2015-11-23 11:46:08 -05:00
|
|
|
@listenToOnce classroomCourseInstances, 'sync', ->
|
|
|
|
# join any course instances in the classroom which are free to join
|
|
|
|
jqxhrs = []
|
|
|
|
for courseInstance in classroomCourseInstances.models
|
|
|
|
course = @courses.get(courseInstance.get('courseID'))
|
|
|
|
if course.get('free')
|
|
|
|
jqxhrs.push = courseInstance.addMember(me.id)
|
2015-11-29 18:13:23 -05:00
|
|
|
courseInstance.sessions = new Backbone.Collection()
|
2015-11-23 11:46:08 -05:00
|
|
|
@courseInstances.add(courseInstance)
|
|
|
|
$.when(jqxhrs...).done =>
|
2015-11-29 18:13:23 -05:00
|
|
|
@state = null
|
2015-11-23 11:46:08 -05:00
|
|
|
@render()
|
2015-11-29 18:13:23 -05:00
|
|
|
location.hash = ''
|
|
|
|
f = -> location.hash = '#just-added-text'
|
|
|
|
# quick and dirty scroll to just-added classroom
|
|
|
|
setTimeout(f, 10)
|
2015-12-04 15:08:08 -05:00
|
|
|
|
2015-11-23 12:52:15 -05:00
|
|
|
onClickChangeLanguageLink: ->
|
2015-12-04 15:08:08 -05:00
|
|
|
application.tracker?.trackEvent 'Student clicked change language', category: 'Courses'
|
2015-11-23 12:52:15 -05:00
|
|
|
modal = new ChangeCourseLanguageModal()
|
2015-11-29 18:25:57 -05:00
|
|
|
@openModalView(modal)
|
2015-12-04 15:08:08 -05:00
|
|
|
modal.once 'hidden', @render, @
|