From f4344c87930b162d24cbe8f938bc7fb644a15770 Mon Sep 17 00:00:00 2001
From: Jon Johnson <jonjonsonjr@gmail.com>
Date: Mon, 23 Jun 2014 15:39:09 -0400
Subject: [PATCH] Fix terminal carousel

---
 _static/js/landing.js | 47 +++++++++++++++++++++++++++++++------------
 index.html            |  4 ++--
 2 files changed, 36 insertions(+), 15 deletions(-)

diff --git a/_static/js/landing.js b/_static/js/landing.js
index 0f704aa9..235834eb 100644
--- a/_static/js/landing.js
+++ b/_static/js/landing.js
@@ -15,14 +15,21 @@ var right = document.getElementById("right");
 var left = document.getElementById("left");
 var current = 0
 var timer = null;
+var fadeInTimer = null;
+var fadeOutTimer = null;
+var letterTimer = null;
+var unletterTimer = null;
 
 var next = function() {
-    clearTimeout(timer);
-    reveal(++current % phrases.length);
-    setTimeout(next, 5000);
+    current = (current + 1) % phrases.length;
+    reveal(current);
+    timer = setTimeout(next, 5000);
 }
+
 var prev = function() {
-    reveal(--current % phrases.length);
+    current = (current === 0) ? phrases.length - 1 : current - 1;
+    reveal(current);
+    timer = setTimeout(next, 5000);
 }
 
 var reveal = function(idx) {
@@ -31,9 +38,9 @@ var reveal = function(idx) {
     var output_text    = phrases[idx][2];
     var old_dix = idx == 0 ? phrases.length - 1 : idx - 1;
     console.log(idx, old_dix, "++++++++++++")
-    var old_args_text  = phrases[old_dix][0]
-    var old_input_text = phrases[old_dix][1]
-    var old_output_text =phrases[old_dix][2]
+    var old_args_text   = args.innerHTML;
+    var old_input_text  = input.innerHTML;
+    var old_output_text = output.innerHTML;
     console.log(args_text, input_text, output_text)
     console.log(old_args_text, old_input_text, old_output_text)
     var s4 = function() {fadeIn(output_text, output);}
@@ -45,20 +52,22 @@ var reveal = function(idx) {
     // letter(input_text, input);
     // output.innerHTML = output_text;
 }
+
 var fadeIn = function(text, element, next, step) {
     step = step || 0
     var nx = function() { fadeIn(text, element, next, ++step); }
     if (step==0) {
         element.innerHTML = "";
-        setTimeout(nx, 550);
+        fadeInTimer = setTimeout(nx, 550);
         return;
     }
     if (step==1) {element.innerHTML = text;}
     if (step>10 || !text) { if (next) {next(); return;} else return;}
     element.style.opacity = (step-1)/10;
     element.style.filter = 'alpha(opacity=' + (step-1)*10 + ')';
-    setTimeout(nx, 50);
+    fadeInTimer = setTimeout(nx, 50);
 }
+
 var fadeOut = function(text, element, next, step) {
     if (step===10) element.innerHTML = text;
     if (step<0 || !text) {
@@ -69,7 +78,7 @@ var fadeOut = function(text, element, next, step) {
     element.style.opacity = step/10;
     element.style.filter = 'alpha(opacity=' + step*10 + ')';
     var nx = function() { fadeOut(text, element, next, --step); }
-    setTimeout(nx, 50);
+    fadeOutTimer = setTimeout(nx, 50);
 }
 
 var unletter = function(text, element, next, timeout, index) {
@@ -78,7 +87,7 @@ var unletter = function(text, element, next, timeout, index) {
     if (index==-1 || !text.length) { if (next) {next(); return;} else return;}
     element.innerHTML = text.substring(0, index);
     var nx = function() { unletter(text, element, next, timeout, --index); }
-    setTimeout(nx, timeout);
+    unletterTimer = setTimeout(nx, timeout);
 }
 
 var letter = function(text, element, next, timeout, index) {
@@ -87,6 +96,18 @@ var letter = function(text, element, next, timeout, index) {
     if (index > text.length || !text.length) { if (next) {next(); return;} else return;}
     element.innerHTML = text.substring(0, index);
     var nx = function() { letter(text, element, next, timeout, ++index); }
-    setTimeout(nx, timeout);
+    letterTimer = setTimeout(nx, timeout);
 }
-setTimeout(next, 3000);
+
+var reset = function() {
+    var timers = [timer, fadeInTimer, fadeOutTimer, letterTimer, unletterTimer];
+    timers.forEach(function (t) {
+      clearTimeout(t);
+    });
+
+    args.innerHTML = "";
+    input.innerHTML = "";
+    output.innerHTML = "";
+}
+
+timer = setTimeout(next, 3000);
diff --git a/index.html b/index.html
index 17da4bd5..6a75342b 100644
--- a/index.html
+++ b/index.html
@@ -26,9 +26,9 @@
                 <h1>Collect your thoughts and notes <br />without leaving the command line</h1>
             </div>
             <div id="prompt">
-                <div class="pleft" onlick="next(); return false;"><i class="icon left"></i></div>
+                <div class="pleft" onclick="reset(); prev(); return false;"><i class="icon left"></i></div>
                 <div class="terminal">$ jrnl <span id="args"></span><span id="input">today: Started writing my memoirs. On the command line. Like a boss.</span><div id="output"></div></div>
-                <div class="pright" onclick="next(); return false;"><i class="icon right"></i></div>
+                <div class="pright" onclick="reset(); next(); return false;"><i class="icon right"></i></div>
             </div>
         </div>
         <div id="nav">