mirror of
https://github.com/codeninjasllc/codecombat.git
synced 2025-03-13 22:49:51 -04:00
Merge branch 'master' of https://github.com/codecombat/codecombat
This commit is contained in:
Nick Winter
commit
bcbffd1f65
6 changed files with 159 additions and 120 deletions
BIN
app/assets/images/pages/courses/102_info.png
Normal file
BIN
app/assets/images/pages/courses/102_info.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 349 KiB |
|
|
@ -1,8 +1,14 @@
|
|||
#course-info-view
|
||||
|
||||
.btn-enroll
|
||||
margin-top: 20px
|
||||
|
||||
.center
|
||||
text-align: center
|
||||
|
||||
.concepts-container
|
||||
width: 200px
|
||||
|
||||
.contact-container
|
||||
margin-top: 20px
|
||||
text-align: center
|
||||
|
|
@ -16,3 +22,6 @@
|
|||
|
||||
.praise-source
|
||||
font-size: 16px
|
||||
|
||||
.progress-container
|
||||
width: 200px
|
||||
|
|
|
|||
|
|
@ -4,134 +4,145 @@ block content
|
|||
|
||||
//- DO NOT localize / i18n
|
||||
|
||||
div TODO: fix ugly tabs
|
||||
div TODO: aggregate student progress
|
||||
div TODO: student level progress popups
|
||||
div
|
||||
span *UNDER CONSTRUCTION, send feedback to
|
||||
a.spl(href='mailto:team@codecombat.com') team@codecombat.com
|
||||
div
|
||||
input.student-view-checkbox(type='checkbox')
|
||||
input.student-mode-checkbox(type='checkbox')
|
||||
span.spl Student view
|
||||
div TODO: fix ugly tabs
|
||||
div TODO: student view
|
||||
div TODO: aggregate student progress
|
||||
div TODO: student level progress popups
|
||||
div(style='border-bottom: 1px solid black;')
|
||||
|
||||
h1= course.title
|
||||
p= course.description
|
||||
p
|
||||
strong Concepts:
|
||||
ul
|
||||
each concept in courseConcepts
|
||||
li(data-i18n="concepts." + concept)
|
||||
strong= course.duration
|
||||
//- p
|
||||
//- strong Concepts:
|
||||
//- ul
|
||||
//- each concept in courseConcepts
|
||||
//- li(data-i18n="concepts." + concept)
|
||||
//- strong= course.duration
|
||||
|
||||
p
|
||||
.form-group
|
||||
span.spr Select your class
|
||||
select.form-control.select-session
|
||||
each instance in instances
|
||||
option= instance.name
|
||||
if !studentMode
|
||||
p
|
||||
.form-group
|
||||
span.spr Select your class
|
||||
select.form-control.select-session
|
||||
each instance in instances
|
||||
option= instance.name
|
||||
|
||||
h3= instance.name
|
||||
span.spl
|
||||
button.btn.btn-xs.edit-class-name-btn edit class name
|
||||
if !studentMode
|
||||
span.spl
|
||||
button.btn.btn-xs.edit-class-name-btn edit class name
|
||||
|
||||
p
|
||||
if instance.description
|
||||
span= instance.description
|
||||
span.spl
|
||||
button.btn.btn-xs.edit-description-btn edit class description
|
||||
else
|
||||
if !studentMode
|
||||
span.spl
|
||||
button.btn.btn-xs.edit-description-btn edit class description
|
||||
else if !studentMode
|
||||
div
|
||||
button.btn.btn-xs.edit-description-btn add class description
|
||||
|
||||
.form-group
|
||||
span.spr Select language
|
||||
select.form-control.select-language
|
||||
option(value="Python") Python
|
||||
option(value="JavaScript") JavaScript
|
||||
option(value="All Languages") All Languages
|
||||
if !studentMode
|
||||
.form-group
|
||||
span.spr Select language
|
||||
select.form-control.select-language
|
||||
option(value="Python") Python
|
||||
option(value="JavaScript") JavaScript
|
||||
option(value="All Languages") All Languages
|
||||
|
||||
div(role='tabpanel')
|
||||
ul.nav.nav-tabs(role='tablist')
|
||||
li.active(role='presentation')
|
||||
a(href='#progress', aria-controls='progress', role='tab', data-toggle='tab') Students
|
||||
li(role='presentation')
|
||||
a(href='#invite', aria-controls='invite', role='tab', data-toggle='tab') Add Students
|
||||
if !studentMode
|
||||
li.active(role='presentation')
|
||||
a(href='#progress', aria-controls='progress', role='tab', data-toggle='tab') Students
|
||||
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
|
||||
|
||||
.tab-content
|
||||
.tab-pane.active#progress(role='tabpanel')
|
||||
if instance.students
|
||||
table.table.table-condensed
|
||||
thead
|
||||
tr
|
||||
th
|
||||
th
|
||||
span.progress-header Progress
|
||||
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
|
||||
if !studentMode
|
||||
.tab-pane.active#progress(role='tabpanel')
|
||||
if instance.students
|
||||
table.table.table-condensed
|
||||
thead
|
||||
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-level-cell.progress-level-cell-complete(data-i18n="concepts." + concept)
|
||||
else if userConceptsMap[student] && userConceptsMap[student][concept] === 'started'
|
||||
span.spr.progress-level-cell.progress-level-cell-started(data-i18n="concepts." + concept)
|
||||
else
|
||||
span.spr.progress-level-cell.progress-level-cell-not-started(data-i18n="concepts." + concept)
|
||||
th
|
||||
th
|
||||
span.progress-header Progress
|
||||
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-level-cell.progress-level-cell-complete(data-i18n="concepts." + concept)
|
||||
else if userConceptsMap[student] && userConceptsMap[student][concept] === 'started'
|
||||
span.spr.progress-level-cell.progress-level-cell-started(data-i18n="concepts." + concept)
|
||||
else
|
||||
span.spr.progress-level-cell.progress-level-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}
|
||||
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++
|
||||
.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}
|
||||
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++
|
||||
|
||||
.tab-pane#invite(role='tabpanel')
|
||||
p Invite students to join this class.
|
||||
if course.title !== 'Introduction to Computer Science'
|
||||
p Student unlock code: #{instance.code}
|
||||
p Class capacity: 34/50
|
||||
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')
|
||||
table.table.table-striped.table-condensed
|
||||
thead
|
||||
tr
|
||||
th
|
||||
th Status
|
||||
th Level
|
||||
th Concepts
|
||||
tbody
|
||||
- var student = instance.students[0]
|
||||
each level in course.levels
|
||||
tr
|
||||
td
|
||||
button.btn.btn-success.btn-play-level(data-level=level) Play
|
||||
td= userLevelStateMap[student][level]
|
||||
td= level
|
||||
td
|
||||
each concept in courseConcepts
|
||||
if levelConceptsMap[level] && levelConceptsMap[level][concept]
|
||||
span.spr.progress-level-cell.level-progression-level-not-started(data-i18n="concepts." + concept)
|
||||
.tab-pane#invite(role='tabpanel')
|
||||
p Invite students to join this class.
|
||||
if course.title !== 'Introduction to Computer Science'
|
||||
p Student unlock code: #{instance.code}
|
||||
p Class capacity: 34/50
|
||||
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 levels-tab
|
||||
table.table.table-striped.table-condensed
|
||||
thead
|
||||
tr
|
||||
th
|
||||
th Status
|
||||
th Level
|
||||
th Concepts
|
||||
tbody
|
||||
- var student = instance.students[0]
|
||||
each level in course.levels
|
||||
tr
|
||||
td
|
||||
button.btn.btn-success.btn-play-level(data-level=level) Play
|
||||
td= userLevelStateMap[student][level]
|
||||
td= level
|
||||
td
|
||||
each concept in courseConcepts
|
||||
if levelConceptsMap[level] && levelConceptsMap[level][concept]
|
||||
span.spr.progress-level-cell.level-progression-level-not-started(data-i18n="concepts." + concept)
|
||||
|
|
|
|||
|
|
@ -4,11 +4,12 @@ block content
|
|||
|
||||
//- DO NOT localize / i18n
|
||||
|
||||
div TODO: Add high-level blurb
|
||||
div TODO: update images, add captions
|
||||
div TODO: Add real marketing copy.
|
||||
div
|
||||
span *UNDER CONSTRUCTION, send feedback to
|
||||
a.spl(href='mailto:team@codecombat.com') team@codecombat.com
|
||||
div TODO: update images, add captions
|
||||
div TODO: Add real marketing copy.
|
||||
div(style='border-bottom: 1px solid black; margin-bottom: 20px')
|
||||
|
||||
|
||||
|
|
@ -16,28 +17,40 @@ block content
|
|||
h1.center= course.title
|
||||
|
||||
p.center.gameplay-img-container
|
||||
img(src='/images/pages/about/coco_comic.jpg' width='700')
|
||||
img(src='/images/pages/courses/102_info.png' width='700')
|
||||
p= course.description
|
||||
p
|
||||
span There is approximately
|
||||
span Approximately
|
||||
strong.spl 5 hours
|
||||
span.spl of content.
|
||||
|
||||
h3 Topics
|
||||
ul
|
||||
p
|
||||
span.spr Concepts covered:
|
||||
each topic in course.topics
|
||||
li= topic
|
||||
span.spr= topic
|
||||
|
||||
h1.center Monitor Student Progress
|
||||
p.center.monitoring-img-container
|
||||
img(src='/images/pages/clans/dashboard_preview.png' width='700')
|
||||
div.container-fluid
|
||||
div.row
|
||||
div.col-md-3
|
||||
div.col-md-6
|
||||
ul
|
||||
li
|
||||
strong Track concepts
|
||||
span.spl learned by each student
|
||||
li Track levels completed for each student
|
||||
li
|
||||
span See your students'
|
||||
strong.spl solutions
|
||||
li Sort students by name or progress
|
||||
div.col-md-3
|
||||
|
||||
h1.center Teachers Love CodeCombat!
|
||||
p
|
||||
div.praise-quote "#{praise.quote}"
|
||||
div.praise-source - #{praise.source}
|
||||
|
||||
h3 Extras
|
||||
p There are help videos and premium email support
|
||||
p.center.monitoring-img-container
|
||||
img(src='/images/pages/clans/dashboard_preview.png' width='700')
|
||||
p There is detailed student progress monitoring.
|
||||
|
||||
p.center
|
||||
button.btn.btn-info.btn-lg.btn-enroll(data-course-id="#{courseID}") Enroll
|
||||
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@ module.exports = class CourseDetailsView extends RootView
|
|||
events:
|
||||
'change .expand-progress-checkbox': 'onExpandedProgressCheckbox'
|
||||
'change .select-session': 'onChangeSession'
|
||||
'change .student-mode-checkbox': 'onChangeStudent'
|
||||
'click .edit-class-name-btn': 'onClickEditClassName'
|
||||
'click .edit-description-btn': 'onClickEditClassDescription'
|
||||
'click .btn-play-level': 'onClickPlayLevel'
|
||||
|
|
@ -34,6 +35,7 @@ module.exports = class CourseDetailsView extends RootView
|
|||
context.userConceptsMap = @userConceptsMap ? {}
|
||||
context.userLevelStateMap = @userLevelStateMap ? {}
|
||||
context.showExpandedProgress = @course.levels.length <= 30 or @showExpandedProgress
|
||||
context.studentMode = @studentMode ? false
|
||||
context
|
||||
|
||||
initData: ->
|
||||
|
|
@ -88,6 +90,10 @@ module.exports = class CourseDetailsView extends RootView
|
|||
@courseConcepts.sort (a, b) => if @conceptsProgression.indexOf(a) < @conceptsProgression.indexOf(b) then -1 else 1
|
||||
@render?()
|
||||
|
||||
onChangeStudent: (e) ->
|
||||
@studentMode = $('.student-mode-checkbox').prop('checked')
|
||||
@render?()
|
||||
$('.student-mode-checkbox').attr('checked', @studentMode)
|
||||
|
||||
onChangeSession: (e) ->
|
||||
@showExpandedProgress = false
|
||||
|
|
|
|||
|
|
@ -25,14 +25,14 @@ data.courses = [
|
|||
{
|
||||
title: 'Introduction to Computer Science'
|
||||
description: 'Learn basic syntax, while loops, and the CodeCombat learning environment.'
|
||||
topics: ['Basic syntax', 'Strings', 'While Loops']
|
||||
topics: ['Basic Syntax', 'Strings', 'Loops']
|
||||
duration: '1 hour of material'
|
||||
levels: ['Dungeons of Kithgard', 'Gems in the Deep', 'Shadow Guard', 'Kounter Kithwise', 'Crawlways of Kithgard', 'Enemy Mine', 'Illusory Interruption', 'Forgetful Gemsmith', 'Signs and Portents', 'Favorable Odds', 'True Names', 'The Prisoner', 'Banefire', 'The Raised Sword', 'Haunted Kithmaze', 'Riddling Kithmaze', 'Descending Further', 'The Second Kithmaze', 'Dread Door', 'Cupboards of Kithgard', 'Hack and Dash']
|
||||
},
|
||||
{
|
||||
title: 'Computer Science 102'
|
||||
description: 'Add parameters, if statements, and some other stuff.'
|
||||
topics: ['Variables', 'Booleans', 'If Statements', 'Arithmetic']
|
||||
topics: ['Arguments', 'Variables', 'If Statements', 'Arithmetic']
|
||||
duration: '5 hours of material'
|
||||
levels: ['Known Enemy', 'Master of Names', 'Lowly Kithmen', 'Closing the Distance', 'Tactical Strike', 'The Final Kithmaze', 'The Gauntlet', 'Radiant Aura', 'Kithgard Gates', 'Destroying Angel', 'Deadly Dungeon Rescue', 'Kithgard Brawl', 'Cavern Survival', 'Breakout', 'Attack Wisely!', 'Kithgard Mastery', 'Kithgard Apprentice', 'Long Kithmaze', 'Boom! and Bust', 'Defense of Plainswood', 'Winding Trail', 'Thumb Biter', 'Gems or Death', 'Backwoods Ambush', 'Patrol Buster', 'Endangered Burl', 'Village Guard', 'Thornbush Farm', 'Back to Back', 'Ogre Encampment', 'Woodland Cleaver', 'Shield Rush', 'Peasant Protection', 'Munchkin Swarm']
|
||||
},
|
||||
|
|
@ -46,14 +46,14 @@ data.courses = [
|
|||
{
|
||||
title: 'Computer Science 104'
|
||||
description: 'Time to tackle arrays and some pvp stuff.'
|
||||
topics: ['Arrays', 'Break Statements']
|
||||
topics: ['Loops', 'Break Statements', 'Arrays']
|
||||
duration: '5 hours of material'
|
||||
levels: ['Hoarding Gold', 'Decoy Drill', 'Yakstraction', 'Sarven Brawl', 'Desert Combat', 'Dust', 'Sarven Rescue', 'Sacred Statue', 'Mirage Maker', 'Sarven Savior', 'Odd Sandstorm', 'Lurkers', 'Preferential Treatment', 'Sarven Shepherd', 'Shine Getter', 'The Trials', 'Mad Maxer', 'Mad Maxer Strikes Back', 'Mad Maxer Sells Out', 'Mad Maxer Gets Greedy', 'Mad Maxer: Redemption', 'Sarven Treasure', 'Harrowland', 'Sarven Siege', 'Clash of Clones', 'Sand Snakes', 'Crag Tag']
|
||||
},
|
||||
{
|
||||
title: 'Computer Science 105'
|
||||
description: 'Time to tackle arrays and some PVP.'
|
||||
topics: ['Arrays', 'Break Statements', 'Object Literals']
|
||||
topics: ['Break Statements', 'Arrays', 'Object Literals']
|
||||
duration: '5 hours of material'
|
||||
levels: ['Slalom', 'Black Diamond', 'Treasure Cave', 'Ogre Gorge Gouger', 'Dance-Off', 'Alpine Rally', 'Cloudrip Commander', 'Mountain Mercenaries']
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in a new issue