Merge pull request joshuawalcher#7 from jacksondc/tabs

Allow tab indentation
lakellie · Jul 13, 2014 · e9d90ab · e9d90ab
2 parents 40d4bd2 + 13874b9
commit e9d90ab
Showing 1 changed file with 29 additions and 6 deletions.
diff --git a/index.html b/index.html
@@ -284,28 +284,51 @@
 function restore_text() {
   if (typeof localStorage != "undefined") $("#writearea").attr("value", localStorage.text).keyup();
 }
+
+function tabs(e) {
+  if(e.keyCode === 9) { // if tab
+      var el = e.target;
+
+      // get caret position or selection
+      var start = el.selectionStart;
+      var end = el.selectionEnd;
+
+      var value = el.value;
+
+      // set text to: text before caret + tab + text after caret
+      el.valuse = value.substring(0, start
+                  + "\t"
+                  + value.substring(end));
+
+      // reset caret position
+      el.selectionStart = el.selectionEnd = start + 1;
+
+      // keep focus
+      e.preventDefault();
+  }
+}
 </script>
 </head>
-<body onLoad="set_search($('#search').val()); set_title(); restore_text()">
+<body onLoad="set_search($('#search').val()); set_title(); restore_text(); set_tabs();">
 <div id="main">
 <a name="top"></a>
 <h1>Written? <span id="titleKitten">Kitten!</span><span id="titleSearch"></span></h1>
 <div id="kittenFrame">
   <div id="warning-no-ls" class="warning" style="display:none">
     <h2>Warning!</h2>
-    <p>We don&apos;t save your work for you! You&apos;ll need to regularly copy 
+    <p>We don&apos;t save your work for you! You&apos;ll need to regularly copy
         and paste your text into a word processor or other application to save it permanently.</p>
     <p>If you want your work saved even if you close your browser,
-    upgrade to a recent version of <a href="https://www.google.com/chrome/">Chrome</a>, 
-      <a href="http://www.mozilla.org/firefox/">Firefox</a>, <a href="http://www.apple.com/safari/">Safari</a> 
+    upgrade to a recent version of <a href="https://www.google.com/chrome/">Chrome</a>,
+      <a href="http://www.mozilla.org/firefox/">Firefox</a>, <a href="http://www.apple.com/safari/">Safari</a>
       or <a href="http://www.opera.com/">Opera</a>.</p>
     <p class="hidelink"><a href="#" class="hide" onClick="hide_warning()">OK, got it!</a></p>
   </div>
   <div id="warning-ls" class="warning" style="display:none">
     <h2>Hey!</h2>
     <p>Looks like your browser supports local storage.  That's great!
         Your writing will be saved even if you close this page.</p>
-    <p>We can't take responsibility for things going wrong, though, so you might want to 
+    <p>We can't take responsibility for things going wrong, though, so you might want to
     copy and paste your work to an external document every so often, just in case.</p>
     <p class="hidelink"><a href="#" class="hide" onClick="hide_warning()">OK, got it!</a></p>
   </div>
@@ -314,7 +337,7 @@ <h2>Hey!</h2>
 
 <form>
   <input type="hidden" name="hidden_count" value="" disabled  />
-  <textarea id="writearea" cols="80" rows="30" onKeyUp="word_count(this.value, hidden_count)"></textarea>
+  <textarea id="writearea" cols="80" rows="30" onKeyDown= "tabs(event);" onKeyUp="word_count(this.value, hidden_count);"></textarea>
 </form>
 <form id="controls">
   <span class="meta">