Add vertical-markup changes.

common/lib/xmodule/xmodule/css/capa/display.scss

@@ -3,6 +3,7 @@ h2 {
   margin-bottom: 15px;
 
   &.problem-header {
+    display: inline-block;
     section.staff {
       margin-top: 30px;
       font-size: 80%;
@@ -20,6 +21,10 @@ h2 {
   color: darken($error-red, 10%);
 }
 
+section.problem-progress {
+  display: inline-block
+}
+
 section.problem {
   @media print {
     display: block;

common/lib/xmodule/xmodule/css/vertical/display.scss

+ .vert-wrapper {
+   
+  .vert-progress {
+      background-color: yellow;
+  }
+
+  .vert-progress-summary {
+      display: inline-block;
+  }
+  
+  .vert-progress-score {
+      display: inline-block;
+      text-align: right;
+  }
+}

common/lib/xmodule/xmodule/js/src/capa/display.coffee

@@ -34,7 +34,18 @@ class @Problem
       MathJax.Hub.Queue [@refreshMath, null, element]
 
   renderProgressState: () =>
-    @$(".problem-progress").html(@el.data('progress_detail'))
+    detail = @el.data('progress_detail')
+    status = @el.data('progress_status')
+    progress = "(" + detail + " points)"
+    if status == "none" and detail? and detail.indexOf('/') > 0
+        a = detail.split('/')
+        possible = parseInt(a[1])
+        if possible == 1
+            progress =  "(" + possible + " point possible)"
+        else 
+            progress =  "(" + possible + " points possible)" 
+ 
+    @$(".problem-progress").html(progress)
     
 
   updateProgress: (response) =>
@@ -42,7 +53,7 @@ class @Problem
         @el.data('progress_status', response.progress_status)
         @el.data('progress_detail', response.progress_detail)
         @el.trigger('progressChanged')
-        @renderProgressState()
+    @renderProgressState()
 
 
   queueing: =>

common/lib/xmodule/xmodule/js/src/sequence/display.coffee

@@ -40,45 +40,15 @@ class @Sequence
 
     return "none"
 
-  updateOverallScore: (details) =>
-    # Given a list of "a/b" strings, compute the sum(a)/sum(b), and the corresponding percentage
-    gotten = 0
-    possible = 0
-    for d in details
-      if d? and d.indexOf('/') > 0
-        a = d.split('/')
-        got = parseInt(a[0])
-        pos = parseInt(a[1])
-        gotten += got
-        possible += pos
-
-    if possible > 0
-      s = (gotten / possible * 100).toFixed(1) + "%"
-    else
-      s = "0%"
-
-    s += " (" + gotten + '/' + possible + ")"
-      
-    @el.find('.overall-progress').html(s)
-      
-
   updateProgress: =>
     new_progress_status = "NA"
-    scores_list = @el.find('.progress-score-list')
-    scores_list.empty()
-    details = []
     _this = this
     $('.problems-wrapper').each (index) ->
       progress_status = $(this).data('progress_status')
       new_progress_status = _this.mergeProgressStatus progress_status, new_progress_status
 
-      progress_detail = $(this).data('progress_detail')
-      scores_list.append("<li>" + progress_detail + "</li>")
-      details.push(progress_detail)
-
     @progressTable[@position] = new_progress_status
     @setProgress(new_progress_status, @link_for(@position))
-    @updateOverallScore(details)
 
   setProgress: (progress, element) ->
       # If progress is "NA", don't add any css class
@@ -124,8 +94,6 @@ class @Sequence
 
       sequence_links = @$('#seq_content a.seqnav')
       sequence_links.click @goto
-      # update score lists
-      @updateProgress()
 
   goto: (event) =>
     event.preventDefault()
@@ -137,7 +105,7 @@ class @Sequence
     if (1 <= new_position) and (new_position <= @num_contents)
       Logger.log "seq_goto", old: @position, new: new_position, id: @id
     
-      # On Sequence chage, destroy any existing polling thread 
+      # On Sequence change, destroy any existing polling thread 
       #   for queued submissions, see ../capa/display.coffee
       if window.queuePollerID
         window.clearTimeout(window.queuePollerID)

common/lib/xmodule/xmodule/js/src/vertical/display.coffee

+class @Vertical
+  constructor: (element) ->
+    @el = $(element).find('.vert-wrapper')
+    @hookUpProgressEvent()
+    @updateProgress()
+ 
+   hookUpProgressEvent: ->
+    $('.problems-wrapper').bind 'progressChanged', @updateProgress
+
+  mergeProgressStatus: (p1, p2) ->
+    # if either is "NA", return the other one
+    if p1 == "NA"
+      return p2
+    if p2 == "NA"
+      return p1
+
+    # Both real progresses
+    if p1 == "done" and p2 == "done"
+      return "done"
+
+    # not done, so if any progress on either, in_progress
+    w1 = p1 == "done" or p1 == "in_progress"
+    w2 = p2 == "done" or p2 == "in_progress"
+    if w1 or w2
+      return "in_progress"
+
+    return "none"
+
+  updateOverallScore: (details, status) =>
+    # Given a list of "a/b" strings, compute the sum(a)/sum(b), and the corresponding percentage
+    gotten = 0
+    possible = 0
+    for d in details
+      if d? and d.indexOf('/') > 0
+        a = d.split('/')
+        got = parseInt(a[0])
+        pos = parseInt(a[1])
+        gotten += got
+        possible += pos
+
+    # only output an overall score if there were some possible:
+    if possible > 0
+      status_msg = ""
+      score = ""
+      if status == "none"
+        status_msg = "(Not Started)"
+        score = "(" + possible + " points possible)"
+      else
+        status_msg = (gotten / possible * 100).toFixed(1) + "%"
+        score = " (" + gotten + '/' + possible + " points)"
+      @el.find('.vert-progress-status').html(status_msg)
+      @el.find('.vert-progress-score').html(score)
+      
+
+  updateProgress: =>
+    # check to see if there is any progress to maintain at all
+    problems = $('.problems-wrapper')
+    if problems.length == 0
+      @el.find('.vert-progress').addClass('hidden')
+      return
+    # we have some problems to update  
+    new_progress_status = "NA"
+    details = []
+    _this = this
+    # $('.problems-wrapper').each (index) ->
+    problems.each (index) ->
+      progress_status = $(this).data('progress_status')
+      new_progress_status = _this.mergeProgressStatus progress_status, new_progress_status
+
+      progress_detail = $(this).data('progress_detail')
+      details.push(progress_detail)
+
+    @updateOverallScore(details, new_progress_status)
+
+

common/lib/xmodule/xmodule/seq_module.py

@@ -57,6 +57,11 @@ class SequenceModule(XModule):
         (assumes that each submodule uses the same "units" for progress.)
         '''
         # TODO: Cache progress or children array?
+        # TODO: Also need to do the right thing here when combining children
+        # with different kinds of progress:  problem modules have fraction of
+        # problems that have been completed (correctly?).  Video modules (may
+        # someday) have fraction of video that has been watched.  Need to figure
+        # out how to combine these.
         children = self.get_children()
         progresses = [child.get_progress() for child in children]
         progress = reduce(Progress.add_counts, progresses)

common/lib/xmodule/xmodule/vertical_module.py

 from xmodule.x_module import XModule
 from xmodule.seq_module import SequenceDescriptor
 from xmodule.progress import Progress
+from pkg_resources import resource_string
 
 # HACK: This shouldn't be hard-coded to two types
 # OBSOLETE: This obsoletes 'type'
@@ -10,6 +11,11 @@ class_priority = ['video', 'problem']
 class VerticalModule(XModule):
     ''' Layout module for laying out submodules vertically.'''
 
+    js = {'coffee': [resource_string(__name__,
+                                     'js/src/vertical/display.coffee')]}
+    css = {'scss': [resource_string(__name__, 'css/vertical/display.scss')]}
+    js_module_name = "Vertical"
+
     def __init__(self, system, location, definition, descriptor, instance_state=None, shared_state=None, **kwargs):
         XModule.__init__(self, system, location, definition, descriptor, instance_state, shared_state, **kwargs)
         self.contents = None
@@ -26,6 +32,8 @@ class VerticalModule(XModule):
         """
         Combine the progress of all the children.
         """
+        # TODO: check if children are mixed as to video or problem, so
+        # that add_counts does the right thing.  
         children = self.get_children()
         progresses = [child.get_progress() for child in children]
         progress = reduce(Progress.add_counts, progresses, None)

lms/templates/jasmine/base.html

@@ -21,6 +21,7 @@
     {# static files #}
     {% compressed_js 'application' %}
     {% compressed_js 'module-js' %}
+    {% compressed_js 'courseware' %}
 
     {# spec files #}
     {% compressed_js 'spec' %}

lms/templates/seq_module.html

 <div id="sequence_${element_id}" class="sequence" data-id="${item_id}" data-position="${position}" data-course_modx_root="/course/modx" >
-  <div class="student-progress">
-    <div class="summary">
-      Overall: <span class="overall-progress"> </span>
-      
-    </div>
-    <div class="details">
-      Scores:
-      <ul class="progress-score-list">
-      </ul>
-    </div>
-  </div>
   <nav aria-label="Section Navigation" class="sequence-nav">
     <div class="sequence-list-wrapper">
       <ol id="sequence-list">

lms/templates/vert_module.html

-<ol class="vert-mod">
+<div class="vert-wrapper">
+  <div class="vert-progress">
+    <div class="vert-progress-summary">
+      Overall: <span class="vert-progress-status"></span>
+    </div>
+    <div class="vert-progress-score">
+    </div>
+  </div>
+  <ol class="vert-mod">
 % for idx, item in enumerate(items):
-  <li id="vert-${idx}">
-    ${item}
-  </li>
+    <li id="vert-${idx}">
+      ${item}
+    <li>
 % endfor
-</ol>
+  </ol>
+</div>
\ No newline at end of file