vendor: Implement Webpack and make JavaScript files modular for single file compilation into app.js

6 files changed, 276 insertions, 299 deletions

diff --git a/public/js/BackgroundFade.js b/public/js/BackgroundFade.js
new file mode 100644
index 0000000..f47c51f
--- /dev/null
+++ b/public/js/BackgroundFade.js
@@ -0,0 +1,5 @@
+/* onload fade image function */
+
+window.fadeImage = function fadeImage() {
+    document.getElementById("bg").style.opacity = "1";
+}
diff --git a/public/js/Navigator.js b/public/js/Navigator.js
new file mode 100644
index 0000000..6fd7fc8
--- /dev/null
+++ b/public/js/Navigator.js
@@ -0,0 +1,11 @@
+/* main navigator functions */
+
+window.openNav = function openNav() {
+    document.getElementById("side-navbar").style.width = "150px";
+    document.getElementById("main").style.marginLeft = "-148px";
+}
+
+window.closeNav = function closeNav() {
+    document.getElementById("side-navbar").style.width = "0";
+    document.getElementById("main").style.marginLeft = "0";
+}
diff --git a/public/js/Popup.js b/public/js/Popup.js
new file mode 100644
index 0000000..37c0c46
--- /dev/null
+++ b/public/js/Popup.js
@@ -0,0 +1,19 @@
+/* popup window overlay functions */
+
+window.showFaq = function showFaq() {
+    document.getElementById("overlay-faq").style.display = "block";
+}
+
+window.showDemo = function showDemo() {
+    document.getElementById("overlay-demo").style.display = "block";
+}
+
+window.showProjects = function showProjects() {
+    document.getElementById("overlay-projects").style.display = "block";
+}
+
+window.hide = function hide() {
+    document.getElementById("overlay-faq").style.display = "none";
+    document.getElementById("overlay-demo").style.display = "none";
+    document.getElementById("overlay-projects").style.display = "none";
+}
diff --git a/public/js/SoundManager.js b/public/js/SoundManager.js
new file mode 100644
index 0000000..7c1e138
--- /dev/null
+++ b/public/js/SoundManager.js
@@ -0,0 +1,237 @@
+/* inlineplayer.js */
+
+function InlinePlayer() {
+  var self = this;
+  var pl = this;
+  var sm = soundManager; // soundManager instance
+  var isIE = (navigator.userAgent.match(/msie/i));
+  this.playableClass = 'inline-playable'; // CSS class for forcing a link to be playable (eg. doesn't have .MP3 in it)
+  this.excludeClass = 'inline-exclude'; // CSS class for ignoring MP3 links
+  this.links = [];
+  this.sounds = [];
+  this.soundsByURL = [];
+  this.indexByURL = [];
+  this.lastSound = null;
+  this.soundCount = 0;
+
+  this.config = {
+    playNext: false, // stop after one sound, or play through list until end
+    autoPlay: false  // start playing the first sound right away
+  }
+
+  this.css = {
+    // CSS class names appended to link during various states
+    sDefault: 'sm2_link', // default state
+    sLoading: 'sm2_loading',
+    sPlaying: 'sm2_playing',
+    sPaused: 'sm2_paused'
+  }
+
+  this.addEventHandler = (typeof window.addEventListener !== 'undefined' ? function(o, evtName, evtHandler) {
+    return o.addEventListener(evtName,evtHandler,false);
+  } : function(o, evtName, evtHandler) {
+    o.attachEvent('on'+evtName,evtHandler);
+  });
+
+  this.removeEventHandler = (typeof window.removeEventListener !== 'undefined' ? function(o, evtName, evtHandler) {
+    return o.removeEventListener(evtName,evtHandler,false);
+  } : function(o, evtName, evtHandler) {
+    return o.detachEvent('on'+evtName,evtHandler);
+  });
+
+  this.classContains = function(o,cStr) {
+	return (typeof(o.className)!='undefined'?o.className.match(new RegExp('(\\s|^)'+cStr+'(\\s|$)')):false);
+  }
+
+  this.addClass = function(o,cStr) {
+    if (!o || !cStr || self.classContains(o,cStr)) return false;
+    o.className = (o.className?o.className+' ':'')+cStr;
+  }
+
+  this.removeClass = function(o,cStr) {
+    if (!o || !cStr || !self.classContains(o,cStr)) return false;
+    o.className = o.className.replace(new RegExp('( '+cStr+')|('+cStr+')','g'),'');
+  }
+
+  this.getSoundByURL = function(sURL) {
+    return (typeof self.soundsByURL[sURL] != 'undefined'?self.soundsByURL[sURL]:null);
+  }
+
+  this.isChildOfNode = function(o,sNodeName) {
+    if (!o || !o.parentNode) {
+      return false;
+    }
+    sNodeName = sNodeName.toLowerCase();
+    do {
+      o = o.parentNode;
+    } while (o && o.parentNode && o.nodeName.toLowerCase() != sNodeName);
+    return (o.nodeName.toLowerCase() == sNodeName?o:null);
+  }
+
+  this.events = {
+
+    // handlers for sound events as they're started/stopped/played
+
+    play: function() {
+      pl.removeClass(this._data.oLink,this._data.className);
+      this._data.className = pl.css.sPlaying;
+      pl.addClass(this._data.oLink,this._data.className);
+    },
+
+    stop: function() {
+      pl.removeClass(this._data.oLink,this._data.className);
+      this._data.className = '';
+    },
+
+    pause: function() {
+      pl.removeClass(this._data.oLink,this._data.className);
+      this._data.className = pl.css.sPaused;
+      pl.addClass(this._data.oLink,this._data.className);
+    },
+
+    resume: function() {
+      pl.removeClass(this._data.oLink,this._data.className);
+      this._data.className = pl.css.sPlaying;
+      pl.addClass(this._data.oLink,this._data.className);
+    },
+
+    finish: function() {
+      pl.removeClass(this._data.oLink,this._data.className);
+      this._data.className = '';
+      if (pl.config.playNext) {
+        var nextLink = (pl.indexByURL[this._data.oLink.href]+1);
+        if (nextLink<pl.links.length) {
+          pl.handleClick({'target':pl.links[nextLink]});
+        }
+      }
+    }
+
+  }
+
+  this.stopEvent = function(e) {
+   if (typeof e != 'undefined' && typeof e.preventDefault != 'undefined') {
+      e.preventDefault();
+    } else if (typeof event != 'undefined' && typeof event.returnValue != 'undefined') {
+      event.returnValue = false;
+    }
+    return false;
+  }
+
+  this.getTheDamnLink = (isIE)?function(e) {
+    // I really didn't want to have to do this.
+    return (e && e.target?e.target:window.event.srcElement);
+  }:function(e) {
+    return e.target;
+  }
+
+  this.handleClick = function(e) {
+    // a sound link was clicked
+    if (typeof e.button != 'undefined' && e.button>1) {
+      // ignore right-click
+      return true;
+    }
+    var o = self.getTheDamnLink(e);
+    if (o.nodeName.toLowerCase() != 'a') {
+      o = self.isChildOfNode(o,'a');
+      if (!o) return true;
+    }
+    var sURL = o.getAttribute('href');
+    if (!o.href || (!sm.canPlayLink(o) && !self.classContains(o,self.playableClass)) || self.classContains(o,self.excludeClass)) {
+      return true; // pass-thru for non-MP3/non-links
+    }
+    var soundURL = (o.href);
+    var thisSound = self.getSoundByURL(soundURL);
+    if (thisSound) {
+      // already exists
+      if (thisSound == self.lastSound) {
+        // and was playing (or paused)
+        thisSound.togglePause();
+      } else {
+        // different sound
+        sm._writeDebug('sound different than last sound: '+self.lastSound.id);
+        if (self.lastSound) {
+          self.stopSound(self.lastSound);
+        }
+        thisSound.togglePause(); // start playing current
+      }
+    } else {
+      // stop last sound
+      if (self.lastSound) {
+        self.stopSound(self.lastSound);
+      }
+      // create sound
+      thisSound = sm.createSound({
+       id:'inlineMP3Sound'+(self.soundCount++),
+       url:soundURL,
+       onplay:self.events.play,
+       onstop:self.events.stop,
+       onpause:self.events.pause,
+       onresume:self.events.resume,
+       onfinish:self.events.finish,
+       type:(o.type||null)
+      });
+      // tack on some custom data
+      thisSound._data = {
+        oLink: o, // DOM node for reference within SM2 object event handlers
+        className: self.css.sPlaying
+      };
+      self.soundsByURL[soundURL] = thisSound;
+      self.sounds.push(thisSound);
+      thisSound.play();
+    }
+
+    self.lastSound = thisSound; // reference for next call
+
+    if (typeof e != 'undefined' && typeof e.preventDefault != 'undefined') {
+      e.preventDefault();
+    } else {
+      event.returnValue = false;
+    }
+    return false;
+  }
+
+  this.stopSound = function(oSound) {
+    soundManager.stop(oSound.id);
+    soundManager.unload(oSound.id);
+  }
+
+  this.init = function() {
+    sm._writeDebug('inlinePlayer.init()');
+    var oLinks = document.getElementsByTagName('a');
+    // grab all links, look for .mp3
+    var foundItems = 0;
+    for (var i=0, j=oLinks.length; i<j; i++) {
+      if ((sm.canPlayLink(oLinks[i]) || self.classContains(oLinks[i],self.playableClass)) && !self.classContains(oLinks[i],self.excludeClass)) {
+        self.addClass(oLinks[i],self.css.sDefault); // add default CSS decoration
+        self.links[foundItems] = (oLinks[i]);
+        self.indexByURL[oLinks[i].href] = foundItems; // hack for indexing
+        foundItems++;
+      }
+    }
+    if (foundItems>0) {
+      self.addEventHandler(document,'click',self.handleClick);
+      if (self.config.autoPlay) {
+        self.handleClick({target:self.links[0],preventDefault:function(){}});
+      }
+    }
+    sm._writeDebug('inlinePlayer.init(): Found '+foundItems+' relevant items.');
+  }
+
+  this.init();
+
+}
+
+var inlinePlayer = null;
+
+soundManager.setup({
+  debugMode: false, // disable or enable debug output
+  useHTML5Audio: true, // use HTML5 audio for MP3/MP4, if available
+  preferFlash: false,
+  useFlashBlock: false,
+});
+
+// ----
+
+soundManager.onready(function() {
+  inlinePlayer = new InlinePlayer(); // soundManager.createSound() etc. may now be called
+});
diff --git a/public/js/main.js b/public/js/main.js
index 10f2e71..4318226 100644
--- a/public/js/main.js
+++ b/public/js/main.js
@@ -1,275 +1,4 @@
-/* inlineplayer.js */
-
-function InlinePlayer() {
-  var self = this;
-  var pl = this;
-  var sm = soundManager; // soundManager instance
-  var isIE = (navigator.userAgent.match(/msie/i));
-  this.playableClass = 'inline-playable'; // CSS class for forcing a link to be playable (eg. doesn't have .MP3 in it)
-  this.excludeClass = 'inline-exclude'; // CSS class for ignoring MP3 links
-  this.links = [];
-  this.sounds = [];
-  this.soundsByURL = [];
-  this.indexByURL = [];
-  this.lastSound = null;
-  this.soundCount = 0;
-
-  this.config = {
-    playNext: false, // stop after one sound, or play through list until end
-    autoPlay: false  // start playing the first sound right away
-  }
-
-  this.css = {
-    // CSS class names appended to link during various states
-    sDefault: 'sm2_link', // default state
-    sLoading: 'sm2_loading',
-    sPlaying: 'sm2_playing',
-    sPaused: 'sm2_paused'
-  }
-
-  this.addEventHandler = (typeof window.addEventListener !== 'undefined' ? function(o, evtName, evtHandler) {
-    return o.addEventListener(evtName,evtHandler,false);
-  } : function(o, evtName, evtHandler) {
-    o.attachEvent('on'+evtName,evtHandler);
-  });
-
-  this.removeEventHandler = (typeof window.removeEventListener !== 'undefined' ? function(o, evtName, evtHandler) {
-    return o.removeEventListener(evtName,evtHandler,false);
-  } : function(o, evtName, evtHandler) {
-    return o.detachEvent('on'+evtName,evtHandler);
-  });
-
-  this.classContains = function(o,cStr) {
-	return (typeof(o.className)!='undefined'?o.className.match(new RegExp('(\\s|^)'+cStr+'(\\s|$)')):false);
-  }
-
-  this.addClass = function(o,cStr) {
-    if (!o || !cStr || self.classContains(o,cStr)) return false;
-    o.className = (o.className?o.className+' ':'')+cStr;
-  }
-
-  this.removeClass = function(o,cStr) {
-    if (!o || !cStr || !self.classContains(o,cStr)) return false;
-    o.className = o.className.replace(new RegExp('( '+cStr+')|('+cStr+')','g'),'');
-  }
-
-  this.getSoundByURL = function(sURL) {
-    return (typeof self.soundsByURL[sURL] != 'undefined'?self.soundsByURL[sURL]:null);
-  }
-
-  this.isChildOfNode = function(o,sNodeName) {
-    if (!o || !o.parentNode) {
-      return false;
-    }
-    sNodeName = sNodeName.toLowerCase();
-    do {
-      o = o.parentNode;
-    } while (o && o.parentNode && o.nodeName.toLowerCase() != sNodeName);
-    return (o.nodeName.toLowerCase() == sNodeName?o:null);
-  }
-
-  this.events = {
-
-    // handlers for sound events as they're started/stopped/played
-
-    play: function() {
-      pl.removeClass(this._data.oLink,this._data.className);
-      this._data.className = pl.css.sPlaying;
-      pl.addClass(this._data.oLink,this._data.className);
-    },
-
-    stop: function() {
-      pl.removeClass(this._data.oLink,this._data.className);
-      this._data.className = '';
-    },
-
-    pause: function() {
-      pl.removeClass(this._data.oLink,this._data.className);
-      this._data.className = pl.css.sPaused;
-      pl.addClass(this._data.oLink,this._data.className);
-    },
-
-    resume: function() {
-      pl.removeClass(this._data.oLink,this._data.className);
-      this._data.className = pl.css.sPlaying;
-      pl.addClass(this._data.oLink,this._data.className);
-    },
-
-    finish: function() {
-      pl.removeClass(this._data.oLink,this._data.className);
-      this._data.className = '';
-      if (pl.config.playNext) {
-        var nextLink = (pl.indexByURL[this._data.oLink.href]+1);
-        if (nextLink<pl.links.length) {
-          pl.handleClick({'target':pl.links[nextLink]});
-        }
-      }
-    }
-
-  }
-
-  this.stopEvent = function(e) {
-   if (typeof e != 'undefined' && typeof e.preventDefault != 'undefined') {
-      e.preventDefault();
-    } else if (typeof event != 'undefined' && typeof event.returnValue != 'undefined') {
-      event.returnValue = false;
-    }
-    return false;
-  }
-
-  this.getTheDamnLink = (isIE)?function(e) {
-    // I really didn't want to have to do this.
-    return (e && e.target?e.target:window.event.srcElement);
-  }:function(e) {
-    return e.target;
-  }
-
-  this.handleClick = function(e) {
-    // a sound link was clicked
-    if (typeof e.button != 'undefined' && e.button>1) {
-      // ignore right-click
-      return true;
-    }
-    var o = self.getTheDamnLink(e);
-    if (o.nodeName.toLowerCase() != 'a') {
-      o = self.isChildOfNode(o,'a');
-      if (!o) return true;
-    }
-    var sURL = o.getAttribute('href');
-    if (!o.href || (!sm.canPlayLink(o) && !self.classContains(o,self.playableClass)) || self.classContains(o,self.excludeClass)) {
-      return true; // pass-thru for non-MP3/non-links
-    }
-    var soundURL = (o.href);
-    var thisSound = self.getSoundByURL(soundURL);
-    if (thisSound) {
-      // already exists
-      if (thisSound == self.lastSound) {
-        // and was playing (or paused)
-        thisSound.togglePause();
-      } else {
-        // different sound
-        sm._writeDebug('sound different than last sound: '+self.lastSound.id);
-        if (self.lastSound) {
-          self.stopSound(self.lastSound);
-        }
-        thisSound.togglePause(); // start playing current
-      }
-    } else {
-      // stop last sound
-      if (self.lastSound) {
-        self.stopSound(self.lastSound);
-      }
-      // create sound
-      thisSound = sm.createSound({
-       id:'inlineMP3Sound'+(self.soundCount++),
-       url:soundURL,
-       onplay:self.events.play,
-       onstop:self.events.stop,
-       onpause:self.events.pause,
-       onresume:self.events.resume,
-       onfinish:self.events.finish,
-       type:(o.type||null)
-      });
-      // tack on some custom data
-      thisSound._data = {
-        oLink: o, // DOM node for reference within SM2 object event handlers
-        className: self.css.sPlaying
-      };
-      self.soundsByURL[soundURL] = thisSound;
-      self.sounds.push(thisSound);
-      thisSound.play();
-    }
-
-    self.lastSound = thisSound; // reference for next call
-
-    if (typeof e != 'undefined' && typeof e.preventDefault != 'undefined') {
-      e.preventDefault();
-    } else {
-      event.returnValue = false;
-    }
-    return false;
-  }
-
-  this.stopSound = function(oSound) {
-    soundManager.stop(oSound.id);
-    soundManager.unload(oSound.id);
-  }
-
-  this.init = function() {
-    sm._writeDebug('inlinePlayer.init()');
-    var oLinks = document.getElementsByTagName('a');
-    // grab all links, look for .mp3
-    var foundItems = 0;
-    for (var i=0, j=oLinks.length; i<j; i++) {
-      if ((sm.canPlayLink(oLinks[i]) || self.classContains(oLinks[i],self.playableClass)) && !self.classContains(oLinks[i],self.excludeClass)) {
-        self.addClass(oLinks[i],self.css.sDefault); // add default CSS decoration
-        self.links[foundItems] = (oLinks[i]);
-        self.indexByURL[oLinks[i].href] = foundItems; // hack for indexing
-        foundItems++;
-      }
-    }
-    if (foundItems>0) {
-      self.addEventHandler(document,'click',self.handleClick);
-      if (self.config.autoPlay) {
-        self.handleClick({target:self.links[0],preventDefault:function(){}});
-      }
-    }
-    sm._writeDebug('inlinePlayer.init(): Found '+foundItems+' relevant items.');
-  }
-
-  this.init();
-
-}
-
-var inlinePlayer = null;
-
-soundManager.setup({
-  // disable or enable debug output
-  debugMode: true,
-  // use HTML5 audio for MP3/MP4, if available
-  useHTML5Audio: true,
-  preferFlash: false,
-  useFlashBlock: false,
-});
-
-// ----
-
-soundManager.onready(function() {
-  // soundManager.createSound() etc. may now be called
-  inlinePlayer = new InlinePlayer();
-});
-
-/* main navigator functions */
-function openNav() {
-    document.getElementById("side-navbar").style.width = "150px";
-    document.getElementById("main").style.marginLeft = "-148px";
-}
-
-function closeNav() {
-    document.getElementById("side-navbar").style.width = "0";
-    document.getElementById("main").style.marginLeft = "0";
-}
-
-/* popup window overlay functions */
-function showFaq() {
-    document.getElementById("overlay-faq").style.display = "block";
-}
-
-function showDemo() {
-    document.getElementById("overlay-demo").style.display = "block";
-}
-
-function showProjects() {
-    document.getElementById("overlay-projects").style.display = "block";
-}
-
-function hide() {
-    document.getElementById("overlay-faq").style.display = "none";
-    document.getElementById("overlay-demo").style.display = "none";
-    document.getElementById("overlay-projects").style.display = "none";
-}
-
-/* onload fade image function */
-function fadeImage() {
-    document.getElementById("bg").style.opacity = "1";
-}
+require('./SoundManager');
+require('./Navigator');
+require('./Popup');
+require('./BackgroundFade');
diff --git a/public/js/main.slim.js b/public/js/main.slim.js
deleted file mode 100644
index 510be2d..0000000
--- a/public/js/main.slim.js
+++ /dev/null
@@ -1,24 +0,0 @@
-  /* main navigator functions */
-  function openNav() {
-      document.getElementById("side-navbar").style.width = "150px";
-      document.getElementById("main").style.marginLeft = "-148px";
-  }
-
-  function closeNav() {
-      document.getElementById("side-navbar").style.width = "0";
-      document.getElementById("main").style.marginLeft = "0";
-  }
-
-  /* popup window overlay functions */
-  function show() {
-      document.getElementById("overlay").style.display = "block";
-  }
-
-  function hide() {
-      document.getElementById("overlay").style.display = "none";
-  }
-
-  /* onload image functions */
-  function fadeImage() {
-      document.getElementById("bg").style.opacity = "1";
-  }