bammy

Philip Guo · Philip Guo · commit 96b3239ec0f9 · 2011-09-30T20:53:46.000-04:00
diff --git a/edu-python-questions.js b/edu-python-questions.js
@@ -102,6 +102,8 @@ function enterVisualizeMode() {
 function enterGradingMode() {
   appMode = 'grade';
 
+  $("#gradeMatrix #gradeMatrixTbody").empty(); // clear it!!!
+
   $("#pyInputPane").hide();
   $("#pyOutputPane").hide();
   $("#pyGradingPane").show();
@@ -128,19 +130,26 @@ function genTestResultHandler(idx) {
 
     readyToGradeSubmission();
   }
+
   return ret;
 }
 
 function genDebugLinkHandler(failingTestIndex) {
   function ret() {
-    console.log('DEBUG', failingTestIndex);
-
-    // TODO: switch back to visualize mode, populating the "test" input
+    // Switch back to visualize mode, populating the "test" input
     // field with the failing test case, and RE-RUN the back-end to
     // visualize execution (with proper IDs)
 
+    curTestIndex = failingTestIndex;
+    $("#testCodeInput").val(tests[curTestIndex]);
+
+    $(this).html("One sec ..."); // this is the current LINK element
+
+    $("#executeBtn").trigger('click'); // emulate an execute button press!
+
     return false; // don't reload the page
   }
+
   return ret;
 }
 
@@ -229,12 +238,14 @@ function finishQuestionsInit(questionsDat) {
 // have been populated by their respective AJAX POST calls
 function readyToGradeSubmission() {
   enterGradingMode();
-  $("#submittedCodeRO").val($("#actualCodeInput").val());
+
+  $("#submittedCodePRE").html(htmlspecialchars($("#actualCodeInput").val()));
+  //$("#submittedCodeRO").val($("#actualCodeInput").val());
 
   for (var i = 0; i < tests.length; i++) {
     var res = testResults[i];
 
-    $("#gradeMatrix tbody.gradeMatrixTbody").append('<tr class="gradeMatrixRow"></tr>');
+    $("#gradeMatrix tbody#gradeMatrixTbody").append('<tr class="gradeMatrixRow"></tr>');
 
     $("#gradeMatrix tr.gradeMatrixRow:last").append('<td class="testInputCell"></td>');
 
@@ -258,7 +269,7 @@ function readyToGradeSubmission() {
     }
 
     if (res.status == 'error') {
-      $("#gradeMatrix tr.gradeMatrixRow:last").append('<td class="testOutputCell">' + res.error_msg + '</td>');
+      $("#gradeMatrix tr.gradeMatrixRow:last").append('<td class="testOutputCell"><span style="padding: 5px; background-color: ' + errorColor + ';">' + res.error_msg + '</span></td>');
     }
     else {
       assert(res.status == 'ok');
@@ -302,11 +313,11 @@ function readyToGradeSubmission() {
   }
 
   if (numPassed < tests.length) {
-    $("#gradeSummary").html('Your solution passed ' + numPassed + '/' + tests.length + ' tests.  Try to debug the incorrect outputs!');
+    $("#gradeSummary").html('Your submitted answer passed ' + numPassed + ' out of ' + tests.length + ' tests.  Try to debug the failed tests!');
   }
   else {
     assert(numPassed == tests.length);
-    $("#gradeSummary").html('Congrats, your solution passed all ' + tests.length + ' tests!');
+    $("#gradeSummary").html('Congrats, your submitted answer passed all ' + tests.length + ' tests!');
   }
 
 }
diff --git a/edu-python.css b/edu-python.css
@@ -91,7 +91,7 @@ span {
 
 #pyInputPane {
   text-align: center;
-  margin-bottom: 35px;
+  margin-bottom: 20px;
 }
 
 td#stack_td,
@@ -574,17 +574,11 @@ table#gradeMatrix thead {
 
 table#gradeMatrix td.testInputCell,
 table#gradeMatrix td.testOutputCell {
-  padding-left: 10px;
-  padding-right: 10px;
+  padding-right: 25px;
   padding-bottom: 8px;
   vertical-align: middle;
 }
  
-#gradeSummary {
-  margin-top: 12px;
-  font-size: 12pt;
-}
-
 td.testInputVarnameCell,
 td.testOutputVarnameCell {
   padding-right: 8px;
@@ -595,3 +589,21 @@ td.testOutputValCell {
   padding-right: 5px;
 }
 
+pre#submittedCodePRE {
+  font-size: 10pt;
+  font-family: Andale mono, monospace;
+  background-color: #dddddd;
+  padding: 5px;
+}
+
+div#submittedSolutionDisplay {
+  width: 650px; /* to line up with questionsHeaderPane */
+  text-align: left;
+  font-size: 12pt;
+  margin-bottom: 20px;
+}
+
+#gradeSummary {
+  margin-top: 12px;
+}
+
diff --git a/edu-python.js b/edu-python.js
@@ -43,6 +43,7 @@ var lightGray = "#cccccc";
 var darkBlue = "#3D58A2";
 var lightBlue = "#899CD1";
 var pinkish = "#F15149";
+var darkRed = "#9d1e18";
 
 
 // ugh globals!
diff --git a/question.html b/question.html
@@ -139,13 +139,13 @@
 
 <div id="pyGradingPane">
 
-<center>
 
-Your submitted solution:<br/>
-<textarea id="submittedCodeRO" cols="60" rows="12" wrap="off" readonly="readonly">
-</textarea>
+<center>
 
-<div id="gradeSummary"></div>
+<div id="submittedSolutionDisplay">
+  <pre id="submittedCodePRE"></pre>
+  <div id="gradeSummary"></div>
+</div>
 
 <table id="gradeMatrix">
 <thead>
@@ -155,7 +155,7 @@
 <td>Status</td>
 </tr>
 </thead>
-<tbody class="gradeMatrixTbody">
+<tbody id="gradeMatrixTbody">
 </tbody>
 </table>
 
