Moved lists back to same folder as songs.

[songbook.git] / web / songbook.js

diff --git a/web/songbook.js b/web/songbook.js
index 85a4b18..5d0ec0f 100644 (file)
--- a/web/songbook.js
+++ b/web/songbook.js
@@ -1,14 +1,39 @@
-// Javascript functions for controling audio
-starttime = null;
-endtime   = null;
-
-spacebar       = 32;
-return2start   = 82;
-backfewsecs    = 66;
-forwardfewsecs = 70;
-seta           = 65;
-cleara         = 67;
-howmanysecs    = 10;
+// Javascript functions for controlling audio
+var starttime    = 0;
+var endtime      = 0;
+var ascrollpoint = 0;
+var bscrollpoint = 0;
+
+var song, interval, scroll, body;
+
+// 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 (ascrollpoint != 0) window.scrollTo(0, ascrollpoint);
+  } // if
+} // loop
+
+function scrollLyrics(x, y) {
+  window.scrollBy(0, scrollby);
+} // scrollLyrics
 
 window.onload = function() {
   song = document.getElementById('song');
@@ -17,6 +42,12 @@ window.onload = function() {
   endtime   = song.duration;
   body      = document.getElementsByTagName('body')[0]
 
+  if (!song.paused) {
+   // Set up loop
+   interval = setInterval(loop, oneSec);
+   scroll   = setInterval(scrollLyrics, scrollTime);
+  } // if
+
   body.onkeydown = 
     function(e) {
       var ev = e || event;
@@ -28,43 +59,96 @@ window.onload = function() {
         } // if
 
         if (playing) {
+          // Stop loop
+          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, 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 == backfewsecs) {
+      } else if (ev.keyCode == leftarrow) {
         song.currentTime -= howmanysecs;
-        song.play()
+        body.scrollBy(0, 50);
+        song.play();
 
         return;
-      } else if (ev.keyCode == forwardfewsecs) {
+      } else if (ev.keyCode == rightarrow) {
         song.currentTime += howmanysecs;
+        bosy.scrollBy(0, -50);
         song.play();
 
         return;
       } else if (ev.keyCode == seta) {
+        // Reset endtime if setting a new A marker
+        if (endtime != song.duration) endtime = song.duration;
+
         starttime = song.currentTime;
 
+        // Translate seconds to timecode
+        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;
+          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;
+        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>';
 
         return;
       } // if