add an option to have the stack grow both up and down

Philip Guo · Philip Guo · commit 2e28be6428c7 · 2011-09-23T11:44:34.000-07:00
diff --git a/edu-python.css b/edu-python.css
@@ -147,7 +147,7 @@ table#pyCodeOutput {
   border-top: 1px solid #999999;
   padding-top: 3px;
   border-bottom: 1px solid #999999;
-  margin-top: 5px;
+  margin-top: 6px;
 }
 
 /* don't wrap lines within code output ... FORCE scrollbars to appear */
@@ -512,15 +512,19 @@ div.heapObject {
   padding-left: 7px; /* leave some room for connector endpoints */
 }
 
-div.stackHeader {
-  margin-bottom: 10px;
+div#stackHeader {
+  margin-bottom: 15px;
   text-align: right;
-  color: #888888;
 }
 
-div.heapHeader {
-  margin-bottom: 10px;
-  text-align: left;
-  color: #888888;
+div#heapHeader {
+  margin-top: 2px;
+  margin-bottom: 13px;
+}
+
+div#stackHeader,
+div#heapHeader {
+  color: #333333;
+  font-size: 10pt;
 }
 
diff --git a/edu-python.js b/edu-python.js
@@ -414,6 +414,29 @@ function renderDataStructuresVersion2(curEntry, vizDiv) {
   // TODO: figure out how to do this using CSS in a robust way!
   $(vizDiv).html('<table id="stackHeapTable"><tr><td id="stack_td"><div id="stack"></div></td><td id="heap_td"><div id="heap"></div></td></tr></table>');
 
+  $(vizDiv + " #stack").append('<div id="stackHeader">Stack grows <select id="stack_growth_selector"><option>down</option><option>up</option></select></div>');
+
+  // select a state based on stackGrowsDown global variable:
+  if (stackGrowsDown) {
+    $("#stack_growth_selector").val('down');
+  }
+  else {
+    $("#stack_growth_selector").val('up');
+  }
+
+  // add trigger
+  $("#stack_growth_selector").change(function() {
+    var v = $("#stack_growth_selector").val();
+    if (v == 'down') {
+      stackGrowsDown = true;
+    }
+    else {
+      stackGrowsDown = false;
+    }
+
+    updateOutput(); // refresh display!!!
+  });
+
 
   var nonEmptyGlobals = false;
   var curGlobalFields = {};
@@ -710,6 +733,10 @@ function renderDataStructuresVersion2(curEntry, vizDiv) {
 
   }
 
+  
+  // prepend heap header after all the dust settles:
+  $(vizDiv + ' #heap').prepend('<div id="heapHeader">Heap</div>');
+
 
   // finally connect stack variables to heap objects via connectors
   for (varID in connectionEndpointIDs) {
diff --git a/index.html b/index.html
@@ -120,7 +120,7 @@
 
 <div id="pyCodeOutputDiv">
 
-Use left and right arrow keys to single-step through this code:
+Use left and right arrow keys to step through this code:
 <table id="pyCodeOutput"></table>
 
 </div>
