2015-06-29 15:15:07 -04:00
app = require ' core/application '
2015-08-23 16:48:52 -04:00
utils = require ' core/utils '
2015-06-29 15:15:07 -04:00
RootView = require ' views/core/RootView '
template = require ' templates/courses/mock1/courses '
module.exports = class CoursesView extends RootView
id: ' courses-view '
template: template
events:
2015-08-04 14:21:02 -04:00
' click .btn-buy ' : ' onClickBuy '
' click .btn-continue ' : ' onClickContinue '
' click .btn-enroll ' : ' onClickEnroll '
2015-06-29 15:15:07 -04:00
' click .btn-enter ' : ' onClickEnter '
2015-08-23 16:48:52 -04:00
' click .btn-student ' : ' onClickStudent '
2015-08-28 14:33:37 -04:00
' click .btn-teacher ' : ' onClickTeacher '
2015-08-04 14:21:02 -04:00
' hidden.bs.modal # continueModal ' : ' onHideContinueModal '
2015-06-29 15:15:07 -04:00
constructor: (options) ->
super options
2015-08-23 16:48:52 -04:00
@studentMode = utils . getQueryVariable ( ' student ' , false ) or options . studentMode
2015-06-29 15:15:07 -04:00
@ initData ( )
getRenderData: ->
context = super ( )
context.courses = @ courses ? [ ]
2015-08-04 14:21:02 -04:00
context.instances = @ instances ? [ ]
2015-08-04 17:29:44 -04:00
context.praise = @ praise
2015-08-23 16:48:52 -04:00
context.studentMode = @ studentMode
2015-06-29 15:15:07 -04:00
context
2015-08-27 19:52:02 -04:00
afterRender: ->
super ( )
@ setupCoursesFAQPopover ( )
2015-06-29 15:15:07 -04:00
initData: ->
mockData = require ' views/courses/mock1/CoursesMockData '
@courses = mockData . courses
for course , i in @ courses
2015-07-29 17:47:10 -04:00
if _ . random ( 0 , 2 ) > 0
2015-06-29 15:15:07 -04:00
course.unlocked = true
else
break
2015-08-04 14:21:02 -04:00
@instances = mockData . instances
2015-08-04 17:29:44 -04:00
@praise = mockData . praise [ _ . random ( 0 , mockData . praise . length - 1 ) ]
2015-06-29 15:15:07 -04:00
2015-08-27 19:52:02 -04:00
setupCoursesFAQPopover: ->
popoverTitle = " <h3>Courses FAQ<button type= ' button ' class= ' close ' onclick= ' $(& # 39;.courses-faq& # 39;).popover(& # 39;hide& # 39;); ' >×</button></h3> "
popoverContent = " <p><strong>Q:</strong> What ' s the difference between these courses and the single player game?</p> "
popoverContent += " <p><strong>A:</strong> The single player game is designed for individuals, while the courses are designed for classes.</p> "
popoverContent += " <p>The single player game has items, gems, hero selection, leveling up, and in-app purchases. Courses have classroom management features and streamlined student-focused level pacing.</p> "
@ $el . find ( ' .courses-faq ' ) . popover (
animation: true
html: true
placement: ' top '
trigger: ' click '
title: popoverTitle
content: popoverContent
container: @ $el
) . on ' shown.bs.popover ' , =>
application . tracker ? . trackEvent ' Subscription payment methods hover '
2015-08-04 14:21:02 -04:00
onClickBuy: (e) ->
2015-08-04 17:29:44 -04:00
courseID = $ ( e . target ) . data ( ' course-id ' ) ? 0
2015-08-23 17:33:07 -04:00
app . router . navigate ( " /courses/mock1/enroll/ #{ courseID } " )
window . location . reload ( )
2015-06-29 15:15:07 -04:00
2015-08-04 14:21:02 -04:00
onClickContinue: (e) ->
2015-06-29 15:15:07 -04:00
courseID = $ ( e . target ) . data ( ' course-id ' )
2015-07-29 17:47:10 -04:00
courseTitle = $ ( e . target ) . data ( ' course-title ' )
2015-08-04 14:21:02 -04:00
$ ( ' # continueModal ' ) . find ( ' .modal-title ' ) . text ( courseTitle )
$ ( ' # continueModal ' ) . find ( ' .btn-buy ' ) . data ( ' course-id ' , courseID )
$ ( ' # continueModal ' ) . find ( ' .btn-enroll ' ) . data ( ' course-id ' , courseID )
$ ( ' # continueModal ' ) . find ( ' .btn-enter ' ) . data ( ' course-id ' , courseID )
$ ( ' # continueModal .row-pick-class ' ) . show ( ) if @ courses [ courseID ] ? . unlocked
2015-08-23 17:33:07 -04:00
if @ courses [ courseID ] ? . unlocked
$ ( ' # continueModal .btn-buy ' ) . prop ( ' innerText ' , ' Start new class ' )
else if courseTitle is ' Introduction to Computer Science '
2015-08-07 13:12:11 -04:00
$ ( ' # continueModal .btn-buy ' ) . prop ( ' innerText ' , ' Get this FREE course! ' )
else
$ ( ' # continueModal .btn-buy ' ) . prop ( ' innerText ' , ' Buy this course ' )
2015-06-29 15:15:07 -04:00
2015-08-04 14:21:02 -04:00
onClickEnroll: (e) ->
$ ( ' # continueModal ' ) . modal ( ' hide ' )
2015-06-29 15:15:07 -04:00
courseID = $ ( e . target ) . data ( ' course-id ' )
2015-08-04 17:52:23 -04:00
instanceID = _ . random ( 0 , @ instances . length - 1 )
2015-08-04 14:21:02 -04:00
viewClass = require ' views/courses/mock1/CourseDetailsView '
2015-08-23 16:48:52 -04:00
viewArgs = [ { studentMode: @ studentMode } , courseID , instanceID ]
2015-08-04 14:21:02 -04:00
navigationEvent = route: " /courses/mock1/ #{ courseID } " , viewClass: viewClass , viewArgs: viewArgs
Backbone . Mediator . publish ' router:navigate ' , navigationEvent
2015-07-29 17:47:10 -04:00
2015-08-04 14:21:02 -04:00
onClickEnter: (e) ->
$ ( ' # continueModal ' ) . modal ( ' hide ' )
2015-07-29 17:47:10 -04:00
courseID = $ ( e . target ) . data ( ' course-id ' )
2015-08-04 17:52:23 -04:00
instanceName = $ ( ' .select-session ' ) . val ( )
2015-08-07 15:03:06 -04:00
for val , index in @ instances when val . name is instanceName
instanceID = index
2015-08-04 14:21:02 -04:00
viewClass = require ' views/courses/mock1/CourseDetailsView '
viewArgs = [ { } , courseID , instanceID ]
navigationEvent = route: " /courses/mock1/ #{ courseID } " , viewClass: viewClass , viewArgs: viewArgs
Backbone . Mediator . publish ' router:navigate ' , navigationEvent
2015-07-29 17:47:10 -04:00
2015-08-23 16:48:52 -04:00
onClickStudent: (e) ->
route = " /courses/mock1?student=true "
viewClass = require ' views/courses/mock1/CoursesView '
viewArgs = [ studentMode: true ]
navigationEvent = route: route , viewClass: viewClass , viewArgs: viewArgs
Backbone . Mediator . publish ' router:navigate ' , navigationEvent
2015-08-28 14:33:37 -04:00
onClickTeacher: (e) ->
route = " /courses/mock1?student=false "
viewClass = require ' views/courses/mock1/CoursesView '
viewArgs = [ studentMode: false ]
navigationEvent = route: route , viewClass: viewClass , viewArgs: viewArgs
Backbone . Mediator . publish ' router:navigate ' , navigationEvent
2015-08-04 14:21:02 -04:00
onHideContinueModal: (e) ->
$ ( ' # continueModal .row-pick-class ' ) . hide ( )