Moving scripts loading into a single file. Renaming slides.js to slide-deck.js

1 files changed, 701 insertions, 0 deletions

diff --git a/js/slide-deck.js b/js/slide-deck.js
new file mode 100644
index 0000000..9ad0290
--- /dev/null
+++ b/js/slide-deck.js
@@ -0,0 +1,701 @@
+document.cancelFullScreen = document.webkitCancelFullScreen ||
+                            document.mozCancelFullScreen;
+
+/**
+ * @constructor
+ */
+function SlideDeck(el) {
+  this.curSlide_ = 0;
+  this.prevSlide_ = 0;
+  this.config_ = null;
+  this.container = el || document.querySelector('slides');
+  this.slides = [];
+  this.controller = null;
+
+  this.getCurrentSlideFromHash_();
+
+  // Call this explicitly. Modernizr.load won't be done until after DOM load.
+  this.onDomLoaded_.bind(this)();
+}
+
+/**
+ * @const
+ * @private
+ */
+SlideDeck.prototype.SLIDE_CLASSES_ = [
+  'far-past', 'past', 'current', 'next', 'far-next'];
+
+/**
+ * @const
+ * @private
+ */
+SlideDeck.prototype.CSS_DIR_ = 'theme/css/';
+
+/**
+ * @private
+ */
+SlideDeck.prototype.getCurrentSlideFromHash_ = function() {
+  var slideNo = parseInt(document.location.hash.substr(1));
+
+  if (slideNo) {
+    this.curSlide_ = slideNo - 1;
+  } else {
+    this.curSlide_ = 0;
+  }
+};
+
+/**
+ * @private
+ */
+SlideDeck.prototype.onDomLoaded_ = function(e) {
+  document.body.classList.add('loaded'); // Fade in deck.
+
+  this.slides = this.container.querySelectorAll('slide:not([hidden]):not(.backdrop)');
+
+  // If we're on a smartphone, apply special sauce.
+  if (Modernizr.mq('only screen and (max-device-width: 480px)')) {
+    // var style = document.createElement('link');
+    // style.rel = 'stylesheet';
+    // style.type = 'text/css';
+    // style.href = this.CSS_DIR_ + 'phone.css';
+    // document.querySelector('head').appendChild(style);
+
+    // No need for widescreen layout on a phone.
+    this.container.classList.remove('layout-widescreen');
+  }
+
+  this.loadConfig_(SLIDE_CONFIG);
+  this.addEventListeners_();
+  this.updateSlides_();
+
+  // Add slide numbers and total slide count metadata to each slide.
+  for (var i = 0, slide; slide = this.slides[i]; ++i) {
+    slide.dataset.slideNum = i + 1;
+    slide.dataset.totalSlides = this.slides.length;
+  }
+
+  // Note: this needs to come after addEventListeners_(), which adds a
+  // 'keydown' listener that this controller relies on.
+  // Also, no need to set this up if we're on mobile.
+  if (!Modernizr.touch) {
+    this.controller = new SlideController(this);
+    if (this.controller.isPopup) {
+      document.body.classList.add('popup');
+    }
+  }
+};
+
+/**
+ * @private
+ */
+SlideDeck.prototype.addEventListeners_ = function() {
+  document.addEventListener('keydown', this.onBodyKeyDown_.bind(this), false);
+  window.addEventListener('popstate', this.onPopState_.bind(this), false);
+
+  // var transEndEventNames = {
+  //   'WebkitTransition': 'webkitTransitionEnd',
+  //   'MozTransition': 'transitionend',
+  //   'OTransition': 'oTransitionEnd',
+  //   'msTransition': 'MSTransitionEnd',
+  //   'transition': 'transitionend'
+  // };
+  // 
+  // // Find the correct transitionEnd vendor prefix.
+  // window.transEndEventName = transEndEventNames[
+  //     Modernizr.prefixed('transition')];
+  // 
+  // // When slides are done transitioning, kickoff loading iframes.
+  // // Note: we're only looking at a single transition (on the slide). This
+  // // doesn't include autobuilds the slides may have. Also, if the slide
+  // // transitions on multiple properties (e.g. not just 'all'), this doesn't
+  // // handle that case.
+  // this.container.addEventListener(transEndEventName, function(e) {
+  //     this.enableSlideFrames_(this.curSlide_);
+  // }.bind(this), false);
+
+  // document.addEventListener('slideenter', function(e) {
+  //   var slide = e.target;
+  //   window.setTimeout(function() {
+  //     this.enableSlideFrames_(e.slideNumber);
+  //     this.enableSlideFrames_(e.slideNumber + 1);
+  //   }.bind(this), 300);
+  // }.bind(this), false);
+};
+
+/**
+ * @private
+ * @param {Event} e The pop event.
+ */
+SlideDeck.prototype.onPopState_ = function(e) {
+  if (e.state != null) {
+    this.curSlide_ = e.state;
+    this.updateSlides_(true);
+  }
+};
+
+/**
+ * @param {Event} e
+ */
+SlideDeck.prototype.onBodyKeyDown_ = function(e) {
+  if (/^(input|textarea)$/i.test(e.target.nodeName) ||
+      e.target.isContentEditable) {
+    return;
+  }
+
+  // Forward keydowns to the main slides if we're the popup.
+  if (this.controller && this.controller.isPopup) {
+    this.controller.sendMsg({keyCode: e.keyCode});
+  }
+
+  switch (e.keyCode) {
+    case 39: // right arrow
+    case 32: // space
+    case 34: // PgDn
+      this.nextSlide();
+      e.preventDefault();
+      break;
+
+    case 37: // left arrow
+    case 8: // Backspace
+    case 33: // PgUp
+      this.prevSlide();
+      e.preventDefault();
+      break;
+
+    case 40: // down arrow
+      //if (this.isChromeVoxActive()) {
+      //  speakNextItem();
+      //} else {
+        this.nextSlide();
+      //}
+      e.preventDefault();
+      break;
+
+    case 38: // up arrow
+      //if (this.isChromeVoxActive()) {
+      //  speakPrevItem();
+      //} else {
+        this.prevSlide();
+      //}
+      e.preventDefault();
+      break;
+
+    case 72: // H
+      document.body.classList.toggle('highlight-code');
+      break;
+
+    case 80: // P
+      if (this.controller && this.controller.isPopup) {
+        document.body.classList.toggle('with-notes');
+      } else if (this.controller && !this.controller.popup) {
+        document.body.classList.toggle('with-notes');
+      }
+      break;
+
+    case 82: // R
+      // TODO: implement refresh on main slides when popup is refreshed.
+      break;
+
+    case 27: // ESC
+      document.body.classList.remove('with-notes');
+      document.body.classList.remove('highlight-code');
+      break;
+
+    case 70: // F
+       // Only respect 'f' on body. Don't want to capture keys from an <input>.
+       // Also, ignore browser's fullscreen shortcut (cmd+shift+f) so we don't
+       // get trapped in fullscreen!
+      if (e.target == document.body && !(e.shiftKey && e.metaKey)) {
+        if (document.mozFullScreen !== undefined && !document.mozFullScreen) {
+          document.body.mozRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
+        } else if (document.webkitIsFullScreen !== undefined && !document.webkitIsFullScreen) {
+          document.body.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
+        } else {
+          document.cancelFullScreen();
+        }
+      }
+      break;
+  }
+};
+
+/**
+ * @private
+ */
+SlideDeck.prototype.loadConfig_ = function(config) {
+  if (!config) {
+    return;
+  }
+
+  this.config_ = config;
+
+  var settings = this.config_.settings;
+
+  this.loadTheme_(settings.theme || []);
+
+  if (settings.favIcon) {
+    this.addFavIcon_(settings.favIcon);
+  }
+
+  // Prettyprint. Default to on.
+  if (!!!('usePrettify' in settings) || settings.usePrettify) {
+    prettyPrint();
+  }
+
+  if (settings.analytics) {
+    this.loadAnalytics_();
+  }
+
+  if (settings.fonts) {
+    this.addFonts_(settings.fonts);