/Demo/slides.js

  1function editSource() {
  2  window.open("http://etherpad.mozilla.org:9000" +
  3              window.location.pathname);
  4}
  5
  6onclick = function(event) {
  7  if (event.shiftKey)
  8    editSource();
  9};
 10
 11onload = function() {
 12  var allSlides = document.querySelectorAll(".slide");
 13  var currSlide;
 14
 15  function $(sel) {
 16   return document.querySelector(sel);
 17  }
 18
 19  function each(sel, fun) {
 20    var nodeList = document.querySelectorAll(sel);
 21    for (var i = 0; i < nodeList.length; i++)
 22      fun.call(nodeList[i], i);
 23  }
 24
 25  function removeClass(elem, className) {
 26    var classes = elem.className.split(" ");
 27    if (classes.indexOf(className) != -1) {
 28      classes.splice(classes.indexOf(className), 1);
 29      elem.className = classes.join(" ");
 30    }
 31  }
 32
 33  function addClass(elem, className) {
 34    var classes = elem.className.split(" ");
 35    if (classes.indexOf(className) == -1)
 36      elem.className += " " + className;
 37  }
 38
 39  function addFooters() {
 40    var footer = $(".title.slide .footer");
 41    var date = $(".title.slide .date");
 42
 43    each(".normal.slide", function() {
 44      if (date)
 45        this.appendChild(date.cloneNode(true));
 46      if (footer)
 47        this.appendChild(footer.cloneNode(true));
 48    });
 49
 50    each(".slide", function(i) {
 51      var slideNo = document.createElement("div");
 52      slideNo.className = "slide-number";
 53      slideNo.textContent = (i + 1) + " / " + allSlides.length;
 54      this.appendChild(slideNo);
 55    });
 56  }
 57
 58  function setCurrSlide(newCurrSlide) {
 59    if (newCurrSlide != currSlide) {
 60      if (currSlide != undefined)
 61        removeClass(allSlides[currSlide - 1], "selected");
 62      currSlide = newCurrSlide;
 63      addClass(allSlides[currSlide - 1], "selected");
 64      if (currSlide == 1)
 65        window.location.hash = "";
 66      else
 67        window.location.hash = "#" + currSlide;
 68    }
 69  }
 70
 71  function setCurrSlideFromHash() {
 72    var hash = window.location.hash;
 73    var match = hash.match(/#(-?[0-9]+)/);
 74    if (match) {
 75      var newSlide = parseInt(match[1]);
 76      if (newSlide < 0)
 77        newSlide = allSlides.length + newSlide;
 78      setCurrSlide(newSlide);
 79    } else
 80      setCurrSlide(1);
 81  }
 82
 83  function prevSlide() {
 84    if (currSlide > 1)
 85      setCurrSlide(currSlide - 1);
 86  }
 87
 88  function nextSlide() {
 89    if (currSlide < allSlides.length)
 90      setCurrSlide(currSlide + 1);
 91  }
 92
 93  if ('onhashchange' in window)
 94    window.onhashchange = setCurrSlideFromHash;
 95  else
 96    window.setInterval(setCurrSlideFromHash, 250);
 97
 98  window.onkeydown = function(event) {
 99    // Don't let Firefox scroll the window *and*
100    // advance the slides at the same time.
101    event.preventDefault();
102  };
103
104  window.onkeyup = function(event) {
105    const LEFT_ARROW = 37;
106    const RIGHT_ARROW = 39;
107    const SPACE = 32;
108
109    switch (event.keyCode) {
110    case SPACE:
111    case RIGHT_ARROW:
112      nextSlide();
113      break;
114    case LEFT_ARROW:
115      prevSlide();
116      break;
117    }
118  };
119
120  function setupTouchUI() {
121    var startX;
122    var startY;
123    var x;
124    var y;
125    var inGesture;
126    
127    document.body.addEventListener("touchstart", function(event) {
128      inGesture = true;
129      startX = event.touches[0].pageX;
130      startY = event.touches[0].pageY;
131    }, false);
132    
133    document.body.addEventListener("touchmove", function(event) {
134      if (event.touches.length == 3)
135        editSource();
136      if (event.touches.length > 1)
137        inGesture = false;
138      if (!inGesture)
139        return;
140      x = event.targetTouches[0].pageX - startX;
141      y = event.targetTouches[0].pageY - startY;
142      event.preventDefault();
143    }, false);
144    
145    document.body.addEventListener("touchend", function(event) {
146      if (!inGesture)
147       return;
148      if (Math.abs(x) < Math.abs(y))
149        return;
150      if (x < 0)
151        nextSlide();
152      if (x > 0)
153        prevSlide();
154    }, false);
155  }
156
157  setCurrSlideFromHash();
158  setupTouchUI();
159  addFooters();
160
161  document.body.style.display = "block";
162  document.title = $(".title.slide .header").textContent;
163};