working on ajax calls

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

@@ -11,11 +11,9 @@ class @Problem
     $(selector, @el)
 
   bind: =>
-    problem_prefix = @element_id.replace(/problem_/,'')
+    problem_prefix = @element_id.replace(/sa_/,'')
     @inputs = @$("[id^=input_#{problem_prefix}_]")
-    
-    @$('section.action input:button').click @refreshAnswers
-    @$('section.action input.check').click @check
+
     @$('section.action input.show').click @show
     @$('section.action input.save').click @save
 
@@ -26,7 +24,7 @@ class @Problem
         @setupInputTypes()
         @bind()
     else
-      $.postWithPrefix "#{@url}/problem_get", (response) =>
+      $.postWithPrefix "#{@url}/sa_get", (response) =>
         @el.html(response.html)
         JavascriptLoader.executeModuleScripts @el, () =>
           @setupInputTypes()
@@ -36,86 +34,21 @@ class @Problem
   # TODO add hooks for problem types here by inspecting response.html and doing
   # stuff if a div w a class is found
 
-  setupInputTypes: =>
-    @inputtypeDisplays = {}
-    @el.find(".capa_inputtype").each (index, inputtype) =>
-      classes = $(inputtype).attr('class').split(' ')
-      id = $(inputtype).attr('id')
-      for cls in classes
-        setupMethod = @inputtypeSetupMethods[cls]
-        if setupMethod?
-          @inputtypeDisplays[id] = setupMethod(inputtype)
-
-  check: =>
-    Logger.log 'problem_check', @answers
-    $.postWithPrefix "#{@url}/problem_check", @answers, (response) =>
-      switch response.success
-        when 'incorrect', 'correct'
-          @render(response.contents)
-          @updateProgress response
-          if @el.hasClass 'showed'
-            @el.removeClass 'showed'
+  show: =>
+    Logger.log 'sa_show', problem: @id
+    $.postWithPrefix "#{@url}/sa_show", (response) =>
+      answers = response.answers
+      $.each answers, (key, value) =>
+        if $.isArray(value)
+          for choice in value
+            @$("label[for='input_#{key}_#{choice}']").attr correct_answer: 'true'
         else
-          @gentle_alert response.success
+          answer = @$("#answer_#{key}, #solution_#{key}")
+          answer.html(value)
+          Collapsible.setCollapsibles(answer)
 
-  reset: =>
-    Logger.log 'problem_reset', @answers
-    $.postWithPrefix "#{@url}/problem_reset", id: @id, (response) =>
-        @render(response.html)
-        @updateProgress response
-
-  # TODO this needs modification to deal with javascript responses; perhaps we
-  # need something where responsetypes can define their own behavior when show
-  # is called.
-  show: =>
-    if !@el.hasClass 'showed'
-      Logger.log 'problem_show', problem: @id
-      $.postWithPrefix "#{@url}/problem_show", (response) =>
-        answers = response.answers
-        $.each answers, (key, value) =>
-          if $.isArray(value)
-            for choice in value
-              @$("label[for='input_#{key}_#{choice}']").attr correct_answer: 'true'
-          else
-            answer = @$("#answer_#{key}, #solution_#{key}")
-            answer.html(value)
-            Collapsible.setCollapsibles(answer)
-
-        # TODO remove the above once everything is extracted into its own
-        # inputtype functions.
-
-        @el.find(".capa_inputtype").each (index, inputtype) =>
-            classes = $(inputtype).attr('class').split(' ')
-            for cls in classes
-              display = @inputtypeDisplays[$(inputtype).attr('id')]
-              showMethod = @inputtypeShowAnswerMethods[cls]
-              showMethod(inputtype, display, answers) if showMethod?
-
-        @el.find('.problem > div').each (index, element) =>
-          MathJax.Hub.Queue ["Typeset", MathJax.Hub, element]
-
-        @$('.show').val 'Hide Answer'
-        @el.addClass 'showed'
-        @updateProgress response
-    else
-      @$('[id^=answer_], [id^=solution_]').text ''
-      @$('[correct_answer]').attr correct_answer: null
-      @el.removeClass 'showed'
-      @$('.show').val 'Show Answer'
-
-      @el.find(".capa_inputtype").each (index, inputtype) =>
-        display = @inputtypeDisplays[$(inputtype).attr('id')]
-        classes = $(inputtype).attr('class').split(' ')
-        for cls in classes
-          hideMethod = @inputtypeHideAnswerMethods[cls]
-          hideMethod(inputtype, display) if hideMethod?
-
-  gentle_alert: (msg) =>
-    if @el.find('.capa_alert').length
-      @el.find('.capa_alert').remove()
-    alert_elem = "<div class='capa_alert'>" + msg + "</div>"
-    @el.find('.action').after(alert_elem)
-    @el.find('.capa_alert').css(opacity: 0).animate(opacity: 1, 700)
+      @$('.show').val 'Hide Answer'
+      @el.addClass 'showed'
 
   save: =>
     Logger.log 'problem_save', @answers
@@ -125,51 +58,6 @@ class @Problem
         @gentle_alert saveMessage
       @updateProgress response
 
-  refreshAnswers: =>
-    @$('input.schematic').each (index, element) ->
-      element.schematic.update_value()
-    @$(".CodeMirror").each (index, element) ->
-      element.CodeMirror.save() if element.CodeMirror.save
-    @answers = @inputs.serialize()
-
-  inputtypeSetupMethods:
-
-    'text-input-dynamath': (element) =>
-      ###
-      Return: function (eqn) -> eqn that preprocesses the user formula input before
-                it is fed into MathJax. Return 'false' if no preprocessor specified
-      ###
-      data = $(element).find('.text-input-dynamath_data')
-
-      preprocessorClassName = data.data('preprocessor')
-      preprocessorClass = window[preprocessorClassName]
-      if not preprocessorClass?
-        return false
-      else
-        preprocessor = new preprocessorClass()
-        return preprocessor.fn
-
-    javascriptinput: (element) =>
-
-      data = $(element).find(".javascriptinput_data")
-
-      params        = data.data("params")
-      submission    = data.data("submission")
-      evaluation    = data.data("evaluation")
-      problemState  = data.data("problem_state")
-      displayClass  = window[data.data('display_class')]
-
-      if evaluation == ''
-          evaluation = null
-
-      container = $(element).find(".javascriptinput_container")
-      submissionField = $(element).find(".javascriptinput_input")
-
-      display = new displayClass(problemState, submission, evaluation, container, submissionField, params)
-      display.render()
-
-      return display
-
   inputtypeShowAnswerMethods:
     choicegroup: (element, display, answers) =>
       element = $(element)

common/lib/xmodule/xmodule/self_assessment_module.py

@@ -70,6 +70,34 @@ class SelfAssessmentModule(XModule):
 
         self.html = self.problem
 
+    def handle_ajax(self, dispatch, get):
+            '''
+            This is called by courseware.module_render, to handle an AJAX call.
+            "get" is request.POST.
+
+            Returns a json dictionary:
+            { 'progress_changed' : True/False,
+            'progress' : 'none'/'in_progress'/'done',
+            <other request-specific values here > }
+            '''
+        handlers = {
+            'sa_get' : self.show_problem
+            'sa_show': self.show_rubric,
+            'sa_save': self.save_problem,
+            }
+
+        if dispatch not in handlers:
+            return 'Error'
+
+        before = self.get_progress()
+        d = handlers[dispatch](get)
+        after = self.get_progress()
+        d.update({
+            'progress_changed': after != before,
+            'progress_status': Progress.to_js_status_str(after),
+            })
+        return json.dumps(d, cls=ComplexEncoder)
+