mirror of
https://github.com/codeninjasllc/codecombat.git
synced 2025-04-26 14:03:28 -04:00
Courses UI - Show progress to students by default
This commit is contained in:
Matt Lott
parent
ea90b93bd2
commit
d47f41548c
1 changed files with 101 additions and 94 deletions
|
|
@ -5,7 +5,6 @@ block content
|
|||
//- DO NOT localize / i18n
|
||||
|
||||
div TODO: fix ugly tabs
|
||||
div TODO: not enrolled yet
|
||||
div
|
||||
span *UNDER CONSTRUCTION, send feedback to
|
||||
a.spl(href='mailto:team@codecombat.com') team@codecombat.com
|
||||
|
|
@ -55,102 +54,28 @@ block content
|
|||
|
||||
div(role='tabpanel')
|
||||
ul.nav.nav-tabs(role='tablist')
|
||||
if !studentMode
|
||||
if studentMode
|
||||
li.active(role='presentation')
|
||||
a(href='#levels', aria-controls='levels', role='tab', data-toggle='tab') Levels
|
||||
li(role='presentation')
|
||||
a(href='#progress', aria-controls='progress', role='tab', data-toggle='tab') Class
|
||||
else
|
||||
li.active(role='presentation')
|
||||
a(href='#progress', aria-controls='progress', role='tab', data-toggle='tab') Class
|
||||
li(role='presentation')
|
||||
a(href='#invite', aria-controls='invite', role='tab', data-toggle='tab') Add Students
|
||||
li(role='presentation')
|
||||
a(href='#levels', aria-controls='levels', role='tab', data-toggle='tab') Levels
|
||||
li(role='presentation')
|
||||
a(href='#levels', aria-controls='levels', role='tab', data-toggle='tab') Levels
|
||||
|
||||
.tab-content
|
||||
if !studentMode
|
||||
if studentMode
|
||||
.tab-pane.active#levels(role='tabpanel')
|
||||
+levels-tab
|
||||
.tab-pane#progress(role='tabpanel')
|
||||
+progress-tab
|
||||
else
|
||||
.tab-pane.active#progress(role='tabpanel')
|
||||
if instance.students
|
||||
h3 Summary
|
||||
- var averagePlaytime = Math.round(Math.random() * 30) + 30
|
||||
p
|
||||
strong(style='font-size:12pt;') Average Play Time
|
||||
p #{averagePlaytime} minutes
|
||||
p
|
||||
strong(style='font-size:12pt;') Concepts Covered
|
||||
table.table.table-condensed
|
||||
each concept in courseConcepts
|
||||
- var conceptCompletion = Math.round(parseFloat(conceptsCompleted[concept]) / instance.students.length * 100)
|
||||
if isNaN(conceptCompletion)
|
||||
- conceptCompletion = 0
|
||||
tr
|
||||
td.concept-completion-container
|
||||
span.concept-completed-foreground(data-i18n="concepts." + concept)
|
||||
span.spl - #{conceptCompletion}%
|
||||
span.concept-completion-background(style="width:#{conceptCompletion}%;")
|
||||
h3 Students
|
||||
table.table.table-condensed
|
||||
thead
|
||||
tr
|
||||
th
|
||||
span.member-header.spr Name
|
||||
if memberSort === 'nameAsc'
|
||||
span.member-header.glyphicon.glyphicon-chevron-up
|
||||
else if memberSort === 'nameDesc'
|
||||
span.member-header.glyphicon.glyphicon-chevron-down
|
||||
th
|
||||
span.progress-header.spr Progress
|
||||
if memberSort === 'progressAsc'
|
||||
span.progress-header.glyphicon.glyphicon-chevron-up
|
||||
else if memberSort === 'progressDesc'
|
||||
span.progress-header.glyphicon.glyphicon-chevron-down
|
||||
else
|
||||
span(style='padding-left:16px;')
|
||||
span.progress-key.progress-key-complete complete
|
||||
span.progress-key.progress-key-started started
|
||||
span.progress-key not started
|
||||
if maxLastStartedIndex > 30
|
||||
input.expand-progress-checkbox(type='checkbox')
|
||||
span.spl.expand-progress-label(data-i18n="clans.exp_levels") Expand levels
|
||||
tbody
|
||||
each student in instance.students
|
||||
tr
|
||||
td
|
||||
a= student
|
||||
td.progress-cell
|
||||
.level-progression-concepts Concepts
|
||||
each concept in courseConcepts
|
||||
if userConceptsMap[student] && userConceptsMap[student][concept] === 'complete'
|
||||
span.spr.progress-concept-cell.progress-concept-cell-complete(data-i18n="concepts." + concept)
|
||||
else if userConceptsMap[student] && userConceptsMap[student][concept] === 'started'
|
||||
span.spr.progress-concept-cell.progress-concept-cell-started(data-i18n="concepts." + concept)
|
||||
else
|
||||
span.spr.progress-concept-cell.progress-concept-cell-not-started(data-i18n="concepts." + concept)
|
||||
|
||||
.level-progression-levels Levels
|
||||
- var i = 0
|
||||
each level in course.levels
|
||||
if userLevelStateMap[student][level] === 'complete'
|
||||
span.progress-level-cell.progress-level-cell-complete #{i + 1}
|
||||
if showExpandedProgress || i === 0 || i === course.levels.length - 1
|
||||
span.spl #{level}
|
||||
.level-popup-container
|
||||
h3 #{i + 1}. #{level}
|
||||
p
|
||||
div
|
||||
- var playTime = Math.round(Math.random() * 600)
|
||||
span Time to solve
|
||||
span : #{playTime} seconds
|
||||
div
|
||||
- var completionDate = new Date()
|
||||
- completionDate.setUTCDate(completionDate.getUTCDate() - Math.round(Math.random() * 60))
|
||||
span Completed on
|
||||
span : #{moment(completionDate).format('MMMM Do YYYY, h:mm:ss a')}
|
||||
strong(data-i18n="clans.view_solution") Click to view solution.
|
||||
else if userLevelStateMap[student][level] === 'started'
|
||||
span.progress-level-cell.progress-level-cell-started #{i + 1} #{level}
|
||||
else
|
||||
span.progress-level-cell.level-progression-level-not-started #{i + 1}
|
||||
if showExpandedProgress || i === 0
|
||||
span.spl #{level}
|
||||
- i++
|
||||
|
||||
+progress-tab
|
||||
.tab-pane#invite(role='tabpanel')
|
||||
p Invite students to join this class.
|
||||
if course.title !== 'Introduction to Computer Science'
|
||||
|
|
@ -159,12 +84,94 @@ block content
|
|||
textarea.textarea-emails(rows=3, placeholder="Enter student emails to invite, one per line")
|
||||
div
|
||||
button.btn.btn-success.btn-invite Send Invites
|
||||
|
||||
.tab-pane#levels(role='tabpanel')
|
||||
+levels-tab
|
||||
else
|
||||
.tab-pane.active#levels(role='tabpanel')
|
||||
+levels-tab
|
||||
|
||||
mixin progress-tab
|
||||
if instance.students
|
||||
h3 Summary
|
||||
- var averagePlaytime = Math.round(Math.random() * 30) + 30
|
||||
p
|
||||
strong(style='font-size:12pt;') Average Play Time
|
||||
p #{averagePlaytime} minutes
|
||||
p
|
||||
strong(style='font-size:12pt;') Concepts Covered
|
||||
table.table.table-condensed
|
||||
each concept in courseConcepts
|
||||
- var conceptCompletion = Math.round(parseFloat(conceptsCompleted[concept]) / instance.students.length * 100)
|
||||
if isNaN(conceptCompletion)
|
||||
- conceptCompletion = 0
|
||||
tr
|
||||
td.concept-completion-container
|
||||
span.concept-completed-foreground(data-i18n="concepts." + concept)
|
||||
span.spl - #{conceptCompletion}%
|
||||
span.concept-completion-background(style="width:#{conceptCompletion}%;")
|
||||
h3 Students
|
||||
table.table.table-condensed
|
||||
thead
|
||||
tr
|
||||
th
|
||||
span.member-header.spr Name
|
||||
if memberSort === 'nameAsc'
|
||||
span.member-header.glyphicon.glyphicon-chevron-up
|
||||
else if memberSort === 'nameDesc'
|
||||
span.member-header.glyphicon.glyphicon-chevron-down
|
||||
th
|
||||
span.progress-header.spr Progress
|
||||
if memberSort === 'progressAsc'
|
||||
span.progress-header.glyphicon.glyphicon-chevron-up
|
||||
else if memberSort === 'progressDesc'
|
||||
span.progress-header.glyphicon.glyphicon-chevron-down
|
||||
else
|
||||
span(style='padding-left:16px;')
|
||||
span.progress-key.progress-key-complete complete
|
||||
span.progress-key.progress-key-started started
|
||||
span.progress-key not started
|
||||
if maxLastStartedIndex > 30
|
||||
input.expand-progress-checkbox(type='checkbox')
|
||||
span.spl.expand-progress-label(data-i18n="clans.exp_levels") Expand levels
|
||||
tbody
|
||||
each student in instance.students
|
||||
tr
|
||||
td
|
||||
a= student
|
||||
td.progress-cell
|
||||
.level-progression-concepts Concepts
|
||||
each concept in courseConcepts
|
||||
if userConceptsMap[student] && userConceptsMap[student][concept] === 'complete'
|
||||
span.spr.progress-concept-cell.progress-concept-cell-complete(data-i18n="concepts." + concept)
|
||||
else if userConceptsMap[student] && userConceptsMap[student][concept] === 'started'
|
||||
span.spr.progress-concept-cell.progress-concept-cell-started(data-i18n="concepts." + concept)
|
||||
else
|
||||
span.spr.progress-concept-cell.progress-concept-cell-not-started(data-i18n="concepts." + concept)
|
||||
|
||||
.level-progression-levels Levels
|
||||
- var i = 0
|
||||
each level in course.levels
|
||||
if userLevelStateMap[student][level] === 'complete'
|
||||
span.progress-level-cell.progress-level-cell-complete #{i + 1}
|
||||
if showExpandedProgress || i === 0 || i === course.levels.length - 1
|
||||
span.spl #{level}
|
||||
.level-popup-container
|
||||
h3 #{i + 1}. #{level}
|
||||
p
|
||||
div
|
||||
- var playTime = Math.round(Math.random() * 600)
|
||||
span Time to solve
|
||||
span : #{playTime} seconds
|
||||
div
|
||||
- var completionDate = new Date()
|
||||
- completionDate.setUTCDate(completionDate.getUTCDate() - Math.round(Math.random() * 60))
|
||||
span Completed on
|
||||
span : #{moment(completionDate).format('MMMM Do YYYY, h:mm:ss a')}
|
||||
strong(data-i18n="clans.view_solution") Click to view solution.
|
||||
else if userLevelStateMap[student][level] === 'started'
|
||||
span.progress-level-cell.progress-level-cell-started #{i + 1} #{level}
|
||||
else
|
||||
span.progress-level-cell.level-progression-level-not-started #{i + 1}
|
||||
if showExpandedProgress || i === 0
|
||||
span.spl #{level}
|
||||
- i++
|
||||
|
||||
mixin levels-tab
|
||||
table.table.table-striped.table-condensed
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue