codecombat/app/templates/courses/courses-view.jade
2016-08-12 13:27:30 -07:00

146 lines
6.5 KiB
Text

extends /templates/base-flat
block content
.container
.row.m-y-3
.col-xs-12
if me.isTeacher()
.alert.alert-danger.text-center
// DNT: Temporary
h3 ATTENTION TEACHERS:
p We are transitioning to a new classroom management system; this page will soon be student-only.
a(href="/teachers/classes") Go to teachers area.
#main-content
if me.isAnonymous()
h1.text-center(data-i18n="courses.welcome_to_courses")
.text-center
p
h2(data-i18n="courses.ready_to_play")
p
button#start-new-game-btn.btn.btn-navy(data-i18n="courses.start_new_game")
p
span.spr -
span.text-uppercase(data-i18n="general.or")
span.spl -
p
button#log-in-btn.btn.btn-forest(data-i18n="login.log_in")
h2#play-now-to-learn-header.text-center.text-uppercase(data-i18n="courses.play_now_learn_header")
ul#benefits-ul
li(data-i18n="courses.play_now_learn_1")
li(data-i18n="courses.play_now_learn_2")
li(data-i18n="courses.play_now_learn_3")
li(data-i18n="courses.play_now_learn_4")
else
.text-center
h1(data-i18n="courses.welcome_to_page") Welcome to your Courses page!
.current-hero-container.text-center.row
.hero-avatar
img(src=view.hero.getPortraitURL())
.current-hero-right-col
.semibold.current-hero-text
span.spr(data-i18n="courses.current_hero")
span.current-hero-name= view.hero.getHeroShortName()
button.change-hero-btn.btn.btn-lg.btn-forest
span(data-i18n="courses.change_hero")
if view.classrooms.size()
h3.text-uppercase(data-i18n="courses.my_classes")
hr
for classroom in view.classrooms.models
- var justAdded = classroom.id === view.classroomJustAdded;
- var classroomClass = justAdded ? 'just-added' : '';
if justAdded
#just-added-text.text-center(data-i18n="courses.class_added")
//- sigh
div(class=classroomClass)
h5
span.spr= classroom.get('name')
span.spr (#{(classroom.get('aceConfig') || {}).language === 'javascript' ? 'JavaScript' : 'Python'})
a.view-class-btn(data-classroom-id=classroom.id, data-i18n="courses.view_class")
- var courseInstances = view.courseInstances.where({classroomID: classroom.id});
for courseInstance in courseInstances
.course-instance-entry
- var course = view.courses.get(courseInstance.get('courseID'));
h6
span.spr= course.get('name')
small
a.view-levels-btn(data-course-id=courseInstance.get('courseID'), data-courseinstance-id=courseInstance.id, data-i18n="courses.view_levels")
+course-instance-body(courseInstance, classroom)
.clearfix
h3.text-uppercase(data-i18n="courses.join_class")
hr
form#join-class-form.form-inline
.help-block
em(data-i18n="courses.ask_teacher_for_code")
.form-group
input#class-code-input.form-control(data-i18n="[placeholder]courses.enter_c_code", placeholder="<Enter Class Code>", value=view.classCode)
input#join-class-button.btn.btn-navy(type="submit", data-i18n="[value]courses.join", value="Join")
if view.state === 'enrolling'
.progress.progress-striped.active
.progress-bar(style="width: 100%", data-i18n="courses.joining") Joining class
if view.errorMessage
.alert.alert-danger= view.errorMessage
mixin course-instance-body(courseInstance, classroom)
- var course = view.courses.get(courseInstance.get('courseID'));
- var stats = classroom.statsForSessions(courseInstance.sessions, course.id);
if stats.levels.done
.text-success
span.glyphicon.glyphicon-ok
span.spl(data-i18n="courses.course_complete")
span !
.pull-right
if stats.levels.done
- var arenaLevel = stats.levels.arena;
- var projectLevel = stats.levels.project;
if arenaLevel
- var arenaURL = "/play/ladder/"+arenaLevel.get('slug')+"/course/"+courseInstance.id;
a.play-btn.btn.btn-burgandy.btn-lg.m-b-1(data-href=arenaURL, data-level-slug=arenaLevel.get('slug'), data-event-action="Students Play Arena")
span(data-i18n="courses.play_arena")
else if projectLevel
- var projectURL = "/play/level/"+projectLevel.get('slug')+"?course="+course.id+"&course-instance="+courseInstance.id;
a.play-btn.btn.btn-burgandy.btn-lg.m-b-1(data-href=projectURL, data-level-slug=projectLevel.get('slug'), data-event-action="Students Play Project")
span(data-i18n="courses.view_project")
else
a.btn.btn-default.btn-lg.m-b-1(disabled=true, data-i18n="courses.course_complete")
else if stats.levels.next != stats.levels.first
- var next = stats.levels.next;
- var levelURL = "/play/level/"+next.get('slug')+"?course="+courseInstance.get('courseID')+"&course-instance="+courseInstance.id;
a.play-btn.btn.btn-forest.btn-lg.m-b-1(data-href=levelURL, data-level-slug=next.get('slug'), data-event-action="Students Continue Course")
span(data-i18n="common.continue")
else
- var firstLevel = stats.levels.first;
- var levelURL = "/play/level/"+firstLevel.get('slug')+"?course="+courseInstance.get('courseID')+"&course-instance="+courseInstance.id;
a.play-btn.btn.btn-navy.btn-lg.m-b-1(data-href=levelURL, data-level-slug=firstLevel.get('slug'), data-event-action="Students Start Course")
span(data-i18n="courses.start")
div
span(data-i18n="clans.playtime")
span.spr :
span= moment.duration(stats.playtime, 'seconds').humanize()
if stats.levels.lastPlayed
div
span(data-i18n="courses.last_level")
span.spr :
span= stats.levels.lastPlayed.get('name')
.clearfix
.progress
.progress-bar(style="width:"+stats.levels.pctDone)= stats.levels.pctDone