codeninjasllc/codecombat
1
0
Fork 0
mirror of https://github.com/codeninjasllc/codecombat.git synced 2025-04-26 05:53:39 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Courses UI: update purchase/continue flow

Browse source 
Don’t show unlock code entry to teachers
Don’t show existing class selection or purchase course to students
Update copy to make it clearer what’s going on
This commit is contained in:
Matt Lott 2015-08-23 14:33:07 -07:00
parent 69f874a31d
commit e8a4fd9336
4 changed files with 31 additions and 29 deletions
app
core
Router.coffee
styles/courses/mock1
courses.sass
templates/courses/mock1
courses.jade
views/courses/mock1
CoursesView.coffee

2
app/core/Router.coffee
View file

@ -60,7 +60,7 @@ module.exports = class CocoRouter extends Backbone.Router
'courses': go('courses/mock1/CoursesView')
'courses/mock1': go('courses/mock1/CoursesView')
'courses/mock1/enroll': go('courses/mock1/CourseEnrollView')
'courses/mock1/enroll/:courseID': go('courses/mock1/CourseEnrollView')
'courses/mock1/:courseID': go('courses/mock1/CourseDetailsView')
'courses/mock1/:courseID/info': go('courses/mock1/CourseInfoView')

3
app/styles/courses/mock1/courses.sass
View file

@ -1,8 +1,5 @@
#courses-view
.btn-continue
margin-top: 40px
.center
text-align: center

44
app/templates/courses/mock1/courses.jade
View file

@ -21,7 +21,7 @@ block content
.col-md-12
.well.well-sm
p
div.instruction-label Pick your class
div.instruction-label Pick from your current classes
.container-fluid
.row
.col-md-8
@ -33,21 +33,19 @@ block content
.row.button-row.center.row-pick-class
.col-md-12
div.or Or
.row.button-row
.col-md-12
.well.well-sm
p
div.instruction-label Enter an unlock code
.container-fluid
.row
.col-md-8
input.code-input(type='text', placeholder="Enter unlock code")
.col-md-4
button.btn.btn-success.btn-enroll Enroll
if !studentMode
.row.button-row.center
if studentMode
.row.button-row
.col-md-12
div.or Or
.well.well-sm
p
div.instruction-label Enter an unlock code
.container-fluid
.row
.col-md-8
input.code-input(type='text', placeholder="Enter unlock code")
.col-md-4
button.btn.btn-success.btn-enroll Enroll
else
.row.button-row.center
.col-md-12
button.btn.btn-success.btn-lg.btn-buy Buy this course
@ -104,8 +102,16 @@ mixin course-block(course, courseID)
each topic in course.topics
li= topic
strong Hours of content: #{course.duration}
.col-md-6.center
if !studentMode || !course.unlocked
button.btn.btn-lg.btn-success.btn-continue(data-toggle='modal', data-target="#continueModal", data-course-title="#{course.title}", data-course-id="#{courseID}") #{course.unlocked ? 'Continue' : 'Enter'}
.col-md-6.center(style='margin-top: 40px;')
if !studentMode
if course.unlocked
button.btn.btn-lg.btn-success.btn-continue(data-toggle='modal', data-target="#continueModal", data-course-title="#{course.title}", data-course-id="#{courseID}") #{course.unlocked ? 'Continue' : 'Enter'}
else if course.title === 'Introduction to Computer Science'
button.btn.btn-lg.btn-success.btn-buy(data-course-id="#{courseID}") Get FREE course
else
button.btn.btn-lg.btn-success.btn-buy(data-course-id="#{courseID}") Buy course
else
a.btn.btn-lg.btn-success.btn-continue(href="/courses/mock1/#{courseID}?student=true") Continue
if course.unlocked
a.btn.btn-lg.btn-success.btn-continue(href="/courses/mock1/#{courseID}?student=true") Continue
else
button.btn.btn-lg.btn-success.btn-continue(data-toggle='modal', data-target="#continueModal", data-course-title="#{course.title}", data-course-id="#{courseID}") Enter

11
app/views/courses/mock1/CoursesView.coffee
View file

@ -40,12 +40,9 @@ module.exports = class CoursesView extends RootView
@praise = mockData.praise[_.random(0, mockData.praise.length - 1)]
onClickBuy: (e) ->
$('#continueModal').modal('hide')
courseID = $(e.target).data('course-id') ? 0
viewClass = require 'views/courses/mock1/CourseEnrollView'
viewArgs = [{}, courseID]
navigationEvent = route: "/courses/mock1/enroll", viewClass: viewClass, viewArgs: viewArgs
Backbone.Mediator.publish 'router:navigate', navigationEvent
app.router.navigate("/courses/mock1/enroll/#{courseID}")
window.location.reload()
onClickContinue: (e) ->
courseID = $(e.target).data('course-id')
@ -55,7 +52,9 @@ module.exports = class CoursesView extends RootView
$('#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
if courseTitle is 'Introduction to Computer Science'
if @courses[courseID]?.unlocked
$('#continueModal .btn-buy').prop('innerText', 'Start new class')
else if courseTitle is 'Introduction to Computer Science'
$('#continueModal .btn-buy').prop('innerText', 'Get this FREE course!')
else
$('#continueModal .btn-buy').prop('innerText', 'Buy this course')