Rearranged sets

[songbook.git] / web / songbook.js

diff --git a/web/songbook.js b/web/songbook.js
index 036a4a2..5d0ec0f 100644 (file)
--- a/web/songbook.js
+++ b/web/songbook.js
@@ -1,28 +1,40 @@
 // Javascript functions for controlling audio
-starttime = 0;
-endtime   = 0;
-song      = null;
-interval  = null;
+var starttime    = 0;
+var endtime      = 0;
+var ascrollpoint = 0;
+var bscrollpoint = 0;
 
-// Keycodes
-spacebar       = 32;
-leftarrow      = 37;
-rightarrow     = 39;
-seta           = 65;
-setb           = 66;
-cleara         = 67;
-return2start   = 82;
+var song, interval, scroll, body;
 
-howmanysecs    = 10;
+// Keycodes
+const spacebar       = 32;
+const leftarrow      = 37;
+const rightarrow     = 39;
+const seta           = 65;
+const setb           = 66;
+const cleara         = 67;
+const return2start   = 82;
+
+const howmanysecs = 10;
+const scrollby    = 1;
+const oneSec      = 1000;
+const scrollTime  = 400;
 
 function loop() {
   // If endtime is not set then we can't loop
   if (endtime == 0) return;
 
   // if we're past the endtime then it's time to start back at the A marker
-  if (song.currentTime > endtime) song.currentTime = starttime;
+  if (song.currentTime > endtime) {
+    song.currentTime = starttime;
+    if (ascrollpoint != 0) window.scrollTo(0, ascrollpoint);
+  } // if
 } // loop
 
+function scrollLyrics(x, y) {
+  window.scrollBy(0, scrollby);
+} // scrollLyrics
+
 window.onload = function() {
   song = document.getElementById('song');
 
@@ -32,7 +44,8 @@ window.onload = function() {
 
   if (!song.paused) {
    // Set up loop
-   interval = setInterval(loop, 1000);
+   interval = setInterval(loop, oneSec);
+   scroll   = setInterval(scrollLyrics, scrollTime);
   } // if
 
   body.onkeydown = 
@@ -47,38 +60,54 @@ window.onload = function() {
 
         if (playing) {
           // Stop loop
-          clearInterval(interval)
+          clearInterval(interval);
+          clearInterval(scroll);
+
           song.pause();
           playing = false;
         } else {
+          if (ascrollpoint != 0) {
+            window.scrollTo(0, ascrollpoint);
+          } else {
+            window.scrollTo(0, 0);
+          } // if
+
           if (starttime != 0) {
-            song.currentTime = starttime
+            song.currentTime = starttime;
           } // if
 
           // Set up loop
-          interval = setInterval(loop, 1000);
+          interval = setInterval(loop, oneSec);
+          scroll   = setInterval(scrollLyrics, scrollTime);
+
+          if (ascrollpoint != 0) window.scrollTo(0, ascrollpoint);
 
           song.play();
+
           playing = true;
         } // if
 
         e.preventDefault();
+
         return;
       } else if (ev.keyCode == return2start) {
-        if (starttime != null) {
+        if (starttime != 0) {
           song.currentTime = starttime;
         } else {
           song.currentTime = 0;
+          body.scrollTo(0,0);
         } // if
 
         return;
       } else if (ev.keyCode == leftarrow) {
         song.currentTime -= howmanysecs;
-        song.play()
+        body.scrollBy(0, 50);
+        song.play();
 
         return;
       } else if (ev.keyCode == rightarrow) {
         song.currentTime += howmanysecs;
+        bosy.scrollBy(0, -50);
         song.play();
 
         return;
@@ -89,17 +118,34 @@ window.onload = function() {
         starttime = song.currentTime;
 
         // Translate seconds to timecode
-        document.getElementById('a').innerHTML = Math.floor(starttime / 60) + ':' + Math.floor(starttime % 60);
+        secs = Math.floor(starttime % 60);
+        if (secs < 10) secs = '0' + secs;
+
+        document.getElementById('a').innerHTML =
+          Math.floor(starttime / 60) + ':' + secs;
+
+        ascrollpoint = window.pageYOffset;
 
         return;
       } else if (ev.keyCode == setb) {
         if (song.currentTime > starttime) {
           endtime = song.currentTime;
-          document.getElementById('b').innerHTML = Math.floor(endtime / 60) + ':' + Math.floor(endtime % 60);
+          song.currentTime = starttime;
+
+          // Translate seconds to timecode
+          secs = Math.floor(endtime % 60);
+          if (secs < 10) secs = '0' + secs;
+
+          document.getElementById('b').innerHTML = 
+              Math.floor(endtime / 60) + ':' + secs;
+
+          bscrollpoint = window.pageYOffset;
         } // if
       } else if (ev.keyCode == cleara) {
-        starttime = 0;
-        endtime   = song.duration;
+        starttime    = 0;
+        endtime      = song.duration;
+        ascrollpoint = 0;
+        bscrollpoint = 0;
 
         document.getElementById('a').innerHTML = '<font color=#666><i>not set</i></font>';
         document.getElementById('b').innerHTML = '<font color=#666><i>not set</i></font>';