Add buttons to view game/web-dev levels to courses views

app/models/Classroom.coffee

@@ -74,7 +74,7 @@ module.exports = class Classroom extends CocoModel
     }
 
   getLevels: (options={}) ->
-    # options: courseID, withoutLadderLevels
+    # options: courseID, withoutLadderLevels, projectLevels
     Levels = require 'collections/Levels'
     courses = @get('courses')
     return new Levels() unless courses
@@ -86,6 +86,8 @@ module.exports = class Classroom extends CocoModel
     levels = new Levels(_.flatten(levelObjects))
     if options.withoutLadderLevels
       levels.remove(levels.filter((level) -> level.isLadder()))
+    if options.projectLevels
+      levels.remove(levels.filter((level) -> not level.isType('game-dev', 'web-dev')))
     return levels
 
   getLadderLevel: (courseID) ->

app/styles/courses/course-details.sass

@@ -35,3 +35,6 @@
 
       h1
         font-size: 48px
+
+  .btn-view-project-level
+    margin-left: 10px;

app/styles/courses/teacher-class-view.sass

@@ -177,7 +177,7 @@
       
   // Course Progress tab
   
-  #course-progress-tab
+  #course-progress-tab, #student-projects-tab
     .course-overview-row
       margin-top: 50px
       border: thin solid gray
@@ -221,7 +221,17 @@
       .btn
         margin-top: 6.5px
         margin-bottom: 6.5px
-    
+
+  #student-projects-tab
+    .student-info
+      margin-top: 5px
+
+    .student-levels-row
+      padding-top: 10px
+      padding-bottom: 15px
+
+    .btn-view-project-level
+      margin-left: 15px
       
   // Checkboxes
   .checkbox-flat

app/templates/courses/course-details.jade

@@ -106,11 +106,16 @@ block content
             if previousLevelCompleted || view.teacherMode || !passedLastCompletedLevel || levelStatus
               - var i18n = level.isType('course-ladder') ? 'play.compete' : 'home.play';
               button.btn.btn-success.btn-play-level(data-level-slug=level.get('slug'), data-i18n=i18n, data-level-id=level.get('original'))
-              if level.isType('game-dev')
+              if level.isType('game-dev', 'web-dev')
                 - var levelOriginal = level.get('original');
                 - var session = view.levelSessions.find(function(session) { return session.get('level').original === levelOriginal });
                 if session
-                  a.btn.btn-warning(href="/play/game-dev-level/#{level.get('slug')}/#{session.id}?course=#{view.courseID}") Game
+                  - var url = '/play/' + level.get('type') + '-level/' + level.get('slug') + '/' + session.id + '?course=' + view.courseID;
+                  a.btn.btn-warning.btn-view-project-level(href=url)
+                    if level.isType('game-dev')
+                      span(data-i18n='') Game
+                    else
+                      span(data-i18n='') Webpage
           td
             if view.userLevelStateMap[me.id]
               div= view.userLevelStateMap[me.id][level.get('original')]

app/templates/courses/teacher-class-view.jade

@@ -311,7 +311,7 @@ mixin courseOverview
   .course-overview-row
     .course-title.student-name
       span= course.get('name')
-      span :
+      span= ': '
       span(data-i18n='teacher.course_overview')
     .course-overview-progress
       each level, index in levels
@@ -330,7 +330,7 @@ mixin studentLevelsRow(student)
       each level, index in levels
         - var progress = state.get('progressData').get({ classroom: view.classroom, course: course, level: level, user: student })
         - var levelNumber = view.classroom.getLevelNumber(level.get('original'), index + 1)
-        +studentLevelProgressDot(progress, level, levelNumber, session)
+        +studentLevelProgressDot(progress, level, levelNumber)
   
 mixin studentCourseProgressDot(progress, levelsTotal, level, label)
   //- TODO: Refactor with TeacherClassesView jade
@@ -438,4 +438,35 @@ mixin enrollmentStatusTab
               button.enroll-student-button.btn.btn-navy(data-i18n="teacher.enroll_student", data-user-id=student.id, data-event-action="Teachers Class Enrollment Enroll Student")
 
 mixin studentProjectsTab
-  p ...
+  #student-projects-tab.m-t-3
+    if state.get('progressData')
+      .render-on-course-sync
+        .student-levels-table
+          +sortButtons
+          each student in state.get('students').models
+            +studentProjectsRow(student)
+
+mixin studentProjectsRow(student)
+  .row.student-levels-row.alternating-background
+    div.student-info.col-sm-3
+      div.student-name= student.broadName()
+      div.student-email.small-details= student.get('email')
+    div.student-levels-progress.col-sm-9
+      each trimCourse in view.classroom.get('courses')
+        - var course = view.courses.get(trimCourse._id);
+        - var levels = view.classroom.getLevels({courseID: course.id, projectLevels: true}).models
+        each level in levels
+          - var progress = state.get('progressData').get({ classroom: view.classroom, course: course, level: level, user: student })
+          - var levelNumber = view.classroom.getLevelNumber(level.get('original'), index + 1)
+          +studentProjectLink(progress, level, levelNumber, course)
+
+mixin studentProjectLink(progress, level, levelNumber, course)
+  - var colorClass = progress.completed ? 'btn-primary' : (progress.started ? 'btn-warning' : 'btn-primary');
+  - var levelName = level.get('name')
+  - var context = _.merge(progress, { levelName: levelName, levelNumber: levelNumber, moment: moment })
+  - var title = view.singleStudentLevelProgressDotTemplate(context);
+  if context.session
+    - var url = '/play/' + level.get('type') + '-level/' + level.get('slug') + '/' + context.session.id + '?course=' + course.id;
+    a(class="btn btn-lg btn-view-project-level " + colorClass, href=url, data-title=title)= levelName
+  else
+    btn(class="btn btn-lg btn-view-project-level " + colorClass, data-title=title, disabled=true)= levelName

app/views/courses/TeacherClassView.coffee

@@ -174,17 +174,17 @@ module.exports = class TeacherClassView extends RootView
         @debouncedRender()
     @listenTo @students, 'sort', @debouncedRender
     super()
-  
+
   afterRender: ->
     super(arguments...)
-    $('.progress-dot').each (i, el) ->
+    $('.progress-dot, .btn-view-project-level').each (i, el) ->
       dot = $(el)
       dot.tooltip({
         html: true
         container: dot
       }).delegate '.tooltip', 'mousemove', ->
         dot.tooltip('hide')
-    
+
   calculateProgressAndLevels: ->
     return unless @supermodel.progress is 1
     # TODO: How to structure this in @state?

app/views/play/level/PlayWebDevLevelView.coffee

@@ -34,4 +34,5 @@ module.exports = class PlayWebDevLevelView extends RootView
 
   destroy: ->
     @webSurface?.destroy()
+    $('body').css('overflow', 'initial')
     super()