Added dzslides template.

author: John MacFarlane <fiddlosopher@gmail.com> 2011-10-01 22:55:48 -0700
committer: John MacFarlane <fiddlosopher@gmail.com> 2011-10-01 22:55:48 -0700
commit: 02b6aebc2a88fb6ab1e0649768e86dd01f20b282 (patch)
tree: 1e49af464d88360ad145b4fa3ddb4619a923e0e2 /default.dzslides
parent: af2b1d117b3d5c74538ab7c98bc3a8b7afc9b7b3 (diff)
download: pandoc-02b6aebc2a88fb6ab1e0649768e86dd01f20b282.tar.gz
1 files changed, 363 insertions, 0 deletions
diff --git a/default.dzslides b/default.dzslides
new file mode 100644
index 000000000..e09c32b40
--- /dev/null
+++ b/default.dzslides
@@ -0,0 +1,363 @@
+<!DOCTYPE html>
+<head>
+<meta charset="utf-8">
+$for(author)$
+  <meta name="author" content="$author$" />
+$endfor$
+$if(date)$
+  <meta name="date" content="$date$" />
+$endif$
+  <title>$if(title-prefix)$$title-prefix$ - $endif$$if(pagetitle)$$pagetitle$$endif$</title>
+$if(highlighting-css)$
+  <style type="text/css">
+/*<![CDATA[*/
+$highlighting-css$
+/*]]>*/
+  </style>
+$endif$
+<title>$title$</title>
+</head>
+<body>
+$if(title)$
+<section>
+  <h1>$title$</h1>
+</section>
+$endif$
+$for(include-before)$
+$include-before$
+$endfor$
+$body$
+$for(include-after)$
+$include-after$
+$endfor$
+<!-- Your Style -->
+<!-- Define the style of you presentation -->
+
+<!-- Maybe a font from http://www.google.com/webfonts ? -->
+<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet'>
+
+<style>
+  html { background-color: black; }
+  body { background-color: white; }
+  /* A section is a slide. Its size is 800x600, and this will never change */
+  section {
+      /* The font from Google */
+      font-family: 'Oswald', arial, serif;
+      font-size: 2em;
+      padding-left: 1em;
+  }
+  h1, h2, h3 {
+      margin-top: 50px;
+      text-align: center;
+  }
+  ul {
+      margin-left: 40px;
+  }
+  a { color: #FF0066; } a:hover { text-decoration: underline; }
+  footer { position: absolute; bottom: 50px; right: 50px; }
+
+  .images {
+    margin: 20px;
+    text-align: center;
+  }
+
+  /* Transition effect */
+  /* Feel free to change the transition effect for original
+     animations. See here:
+     https://developer.mozilla.org/en/CSS/CSS_transitions
+     How to use CSS3 Transitions: */
+  section {
+      -moz-transition: left 400ms linear 0s;
+      -webkit-transition: left 400ms linear 0s;
+      -ms-transition: left 400ms linear 0s;
+      transition: left 400ms linear 0s;
+  }
+
+  /* Before */
+  section { left: -150%; }
+  /* Now */
+  section[aria-selected] { left: 0; }
+  /* After */
+  section[aria-selected] ~ section { left: +150%; }
+
+  /* Increment with lists */
+  .incremental > * { opacity: 1; }
+  .incremental > *[aria-selected] { color: red; opacity: 1; }
+  .incremental > *[aria-selected] ~ * { opacity: 0.2; }
+  /* Increment with images */
+  .incremental > img[aria-selected] { box-shadow: 0 0 10px #000 }
+
+</style>
+
+
+<!-- {{{{ *****************  DZSlides CORE 2.0b1 *************************** -->
+<!-- *********************************************************************** -->
+<!-- *********************************************************************** -->
+<!-- *********************************************************************** -->
+<!-- *********************************************************************** -->
+
+<!-- This block of code is not supposed to be edited, but if you want to change the behavior of the slides, feel free to hack it ;) -->
+
+<!-- Default Style -->
+<style>
+  * { margin: 0; padding: 0; }
+  details { display: none; }
+  body {
+    width: 800px; height: 600px;
+    margin-left: -400px; margin-top: -300px;
+    position: absolute; top: 50%; left: 50%;
+    overflow: hidden;
+  }
+  html {
+    overflow: hidden;
+  }
+  section {
+    position: absolute;
+    pointer-events: none;
+    width: 95%; height: 100%;
+  }
+  section[aria-selected] { pointer-events: auto; }
+  body { display: none; }
+  body.loaded { display: block; }
+  .incremental {visibility: hidden}
+  .incremental[active] {visibility: visible}
+</style>
+
+<script>
+  var friendWindows = [];
+  var idx, step;
+  var slides;
+
+  /* main() */
+
+  window.onload = function() {
+    slides = document.querySelectorAll("body > section");
+    onhashchange();
+    document.body.className = "loaded";
+    setupTouchEvents();
+    onresize();
+  }
+
+  /* Handle keys */
+
+  window.onkeydown = function(e) {
+    // Don't intercept keyboard shortcuts
+    if (e.altKey || e.ctrlKey || e.metaKey || e.shiftKey) {
+      return;
+    }
+    if ( e.keyCode == 37 // left arrow
+      || e.keyCode == 38 // up arrow
+      || e.keyCode == 33 // page up
+    ) {
+      e.preventDefault();
+      back();
+    }
+    if ( e.keyCode == 39 // right arrow
+      || e.keyCode == 40 // down arrow
+      || e.keyCode == 34 // page down
+    ) {
+      e.preventDefault();
+      forward();
+    }
+    if (e.keyCode == 35) { // end
+      e.preventDefault();
+      end();
+    }
+    if (e.keyCode == 36) { // home
+      e.preventDefault();
+      start();
+    }
+
+    if ( e.keyCode == 32) { // space
+        e.preventDefault();
+        toggleContent();
+    }
+  }
+
+  /* Touch Events */
+
+  function setupTouchEvents() {
+    var orgX, newX;
+    var tracking = false;
+
+    var db = document.body;
+    db.addEventListener("touchstart", start, false);
+    db.addEventListener("touchmove", move, false);
+
+    function start(e) {
+      e.preventDefault();
+      tracking = true;
+      orgX = e.changedTouches[0].pageX;
+    }
+
+    function move(e) {
+      if (!tracking) return;
+      newX = e.changedTouches[0].pageX;
+      if (orgX - newX > 100) {
+        tracking = false;
+        forward();
+      } else {
+        if (orgX - newX < -100) {
+          tracking = false;
+          back();
+        }
+      }
+    }
+  }
+
+  /* Adapt the size of the slides to the window */
+
+  window.onresize = function() {
+    var db = document.body;
+    var sx = db.clientWidth / window.innerWidth;
+    var sy = db.clientHeight / window.innerHeight;
+    var transform = "scale(" + (1/Math.max(sx, sy)) + ")";
+    db.style.MozTransform = transform;
+    db.style.WebkitTransform = transform;
+    db.style.OTransform = transform;
+    db.style.msTransform = transform;
+    db.style.transform = transform;
+  }
+  function getDetails(idx) {
+    var s = document.querySelector("section:nth-of-type("+ idx +")");
+    var d = s.querySelector("details");
+    return d?d.innerHTML:"";
+  }
+  window.onmessage = function(e) {
+    var msg = e.data;
+    var win = e.source;
+    if (msg === "register") {
+      friendWindows.push(win);
+      win.postMessage(JSON.stringify({method: "registered", title: document.title, count: slides.length}), "*");
+      win.postMessage(JSON.stringify({method: "newslide", details: getDetails(idx), idx: idx}), "*");
+      return;
+    }
+    if (msg === "back") back();
+    if (msg === "forward") forward();
+    if (msg === "toggleContent") toggleContent();
+    // setSlide(42)
+    var r = /setSlide\((\d+)\)/.exec(msg);
+    if (r) {
+        setSlide(r[1]);
+    }
+  }
+
+  /* If a Video is present in this new slide, play it.
+     If a Video is present in the previous slide, stop it. */
+
+  function toggleContent() {
+    var s = document.querySelector("section[aria-selected]");
+    if (s) {
+        var video = s.querySelector("video");
+        if (video) {
+            if (video.ended || video.paused) {
+                video.play();
+            } else {
+                video.pause();
+            }
+        }
+    }
+  }
+
+  /* If the user change the slide number in the URL bar, jump
+     to this slide. */
+
+  function setCursor(aIdx, aStep) {
+    aStep = (aStep != 0 && typeof aStep !== "undefined") ? "." + aStep : "";
+    window.location.hash = "#" + aIdx + aStep;
+  }
+  window.onhashchange = function(e) {
+    var cursor = window.location.hash.split("#"), newidx = 1, newstep = 0;
+    if (cursor.length == 2) {
+      newidx = ~~cursor[1].split(".")[0];
+      newstep = ~~cursor[1].split(".")[1];
+    }
+    if (newidx != idx) setSlide(newidx);
+    setIncremental(newstep);
+  }
+
+  /* Slide controls */
+
+  function back() {
+    if (idx == 1 && step == 0) return;
+    if (step == 0)
+      setCursor(idx - 1, slides[idx - 2].querySelectorAll('.incremental > *').length);
+    else 
+      setCursor(idx, step - 1);
+  }
+  function forward() {
+    if (idx >= slides.length && step >= slides[idx - 1].querySelectorAll('.incremental > *').length) return;
+    if (step >= slides[idx - 1].querySelectorAll('.incremental > *').length)
+      setCursor(idx + 1, 0);
+    else
+      setCursor(idx, step + 1);
+  }
+  function start() {
+    setCursor(1, 0);
+  }
+  function end() {
+    var lastIdx = slides.length;
+    var lastStep = slides[lastIdx - 1].querySelectorAll('.incremental > *').length;
+    setCursor(lastIdx, lastStep);
+  }
+
+  function setSlide(aIdx) {
+    idx = aIdx;
+    var old = document.querySelector("section[aria-selected]");
+    var next = document.querySelector("section:nth-of-type("+ idx +")");
+    if (old) {
+      old.removeAttribute("aria-selected");
+      var video = old.querySelector("video");
+      if (video) { video.pause(); }
+    }
+    if (next) {
+      next.setAttribute("aria-selected", "true");
+      var video = next.querySelector("video");
+      if (video) { video.play(); }
+    } else {
+      idx = 0;
+      for (var i = 0, l = slides.length; i < l; i++) {
+          if (slides[i].hasAttribute("aria-selected")) {
+              idx = i + 1;
+          }
+      }
+    }
+    for (var i = 0, l = friendWindows.length; i < l; i++) {
+        friendWindows[i].postMessage(JSON.stringify({method: "newslide", details: getDetails(idx), idx: idx}), "*");
+    }
+  }
+  function setIncremental(aStep) {
+    step = aStep;
+    var old = slides[idx-1].querySelector('.incremental > *[aria-selected]');
+    if (old)
+      old.removeAttribute('aria-selected');
+    var incrementals = slides[idx-1].querySelectorAll('.incremental');
+    if (step == 0) {
+      for (var i = 0; i < incrementals.length; i++) {
+        incrementals[i].removeAttribute('active');
+      }
+      return;
+    }
+    var next = slides[idx-1].querySelectorAll('.incremental > *')[step-1];
+    if (next) {
+      next.setAttribute('aria-selected', true);
+      next.parentNode.setAttribute('active', true);
+      var found = false;
+      for (var i = 0; i < incrementals.length; i++) {
+        if (incrementals[i] != next.parentNode)
+          if (found)
+            incrementals[i].removeAttribute('active');
+          else
+            incrementals[i].setAttribute('active', true);
+        else
+          found = true;
+      }
+    } else {
+      setCursor(idx, 0);
+    }
+    return next;
+  }
+</script>
+<!-- vim: set fdm=marker: }}} -->
+</body>
+</html>
author	John MacFarlane <fiddlosopher@gmail.com>	2011-10-01 22:55:48 -0700
committer	John MacFarlane <fiddlosopher@gmail.com>	2011-10-01 22:55:48 -0700
commit	02b6aebc2a88fb6ab1e0649768e86dd01f20b282 (patch)
tree	1e49af464d88360ad145b4fa3ddb4619a923e0e2 /default.dzslides
parent	af2b1d117b3d5c74538ab7c98bc3a8b7afc9b7b3 (diff)
download	pandoc-02b6aebc2a88fb6ab1e0649768e86dd01f20b282.tar.gz