Replace custom help with Bootstrap modal

Author: jordanmccullough

_javascript/curriculum.js

@@ -13,9 +13,7 @@ $(function(){
 	var help = {};
 	help.toggle = function(event){
 		if(event.shiftKey && event.keyCode === 191){
-			console.log("Toggle help");
-
-			$("#help").toggle();
+			$('#help').modal('toggle');
 		}
 	};
 

_layouts/curriculum.html

@@ -3,25 +3,43 @@
 leadingpath: ../
 ---
 
+<!-- Modal -->
+<div class="modal fade" id="help" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
+        <h4 class="modal-title" id="myModalLabel">Help / Shortcuts</h4>
+      </div>
+      <div class="modal-body">
+        <table>
+          <tr>
+            <th>Command</th>
+            <th>Feature</th>
+          </tr>
+
+          <tr>
+            <td><code>?</code></td>
+            <td>Hide/show help</td>
+          </tr>
+
+          <tr>
+            <td><code>?teacher=[github-user]</code></td>
+            <td>Auto-generated teacher slide</td>
+          </tr>
+        </table>
+      </div>
+    </div>
+  </div>
+</div>
+
+
+
+
 
 <div id="help" class="help">
   <div class="content">
-      <table>
-        <tr>
-          <th>Command</th>
-          <th>Feature</th>
-        </tr>
-
-        <tr>
-          <td><code>?</code></td>
-          <td>Hide/show help</td>
-        </tr>
-
-        <tr>
-          <td><code>?teacher=[github-user]</code></td>
-          <td>Auto-generated teacher slide</td>
-        </tr>
-      </table>
+
   </div>
 </div>