orgmode-cli-tools 0.1.0

data/.gitignore

@@ -0,0 +1,4 @@
+generated_slides
+test.org
+test.html
+*_slides

data/Gemfile

@@ -0,0 +1,4 @@
+source "http://rubygems.org"
+
+# Specify your gem's dependencies in keeptesting.gemspec
+gemspec

data/Gemfile.lock

@@ -0,0 +1,29 @@
+PATH
+  remote: .
+  specs:
+    just_paginate (0.0.1)
+
+GEM
+  remote: http://rubygems.org/
+  specs:
+    activesupport (3.2.8)
+      i18n (~> 0.6)
+      multi_json (~> 1.0)
+    i18n (0.6.1)
+    minitest (4.0.0)
+    multi_json (1.3.6)
+    shoulda (3.1.1)
+      shoulda-context (~> 1.0)
+      shoulda-matchers (~> 1.2)
+    shoulda-context (1.0.0)
+    shoulda-matchers (1.3.0)
+      activesupport (>= 3.0.0)
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  just_paginate!
+  minitest
+  shoulda
+  shoulda-context

data/README.MD

@@ -0,0 +1,67 @@
+
+orgmode-cli-tools
+===
+
+A couple of tools to make it easier to work with org-mode files from
+the command-line.
+
+Current available commands:
+
+org2html: convert org files to html
+
+org2revealjs: convert org files into reveal.js presentations
+
+
+Dependencies
+===========
+
+These tools depend on Ruby and Emacs 24.x.
+
+
+Install
+=======
+
+# 1. install gem
+# 2. check emacs dependencies
+#    Your emacs has to support orgmode html export with htmlize
+
+
+
+Usage
+=====
+
+`org2html ORG_FILE_PATH [HTML_FILE_PATH]`
+
+`org2revealjs ORG_FILE_PATH`
+
+
+Examples
+========
+
+Generate a html export of and orgfile and open it in firefox in one step:
+
+`org2html test.org && firefox test.html &!`
+
+Generate a presentation and open it in Firefox in one step:
+
+`org2revealjs test.org && firefox generated_slides/index.html &!`
+
+
+FAQ
+====
+
+Q: Src code in my original org file is syntax highlighted in emacs,
+and is htmlized with colors when I convert manually from within Emacs,
+yet I get no colored syntax highlighting when converting with org2html
+or org2revealjs. What gives?
+
+A: Inline styling of code doesn't work in emacs "batch mode". However
+the code elements are given classes (function, keyword etc), so you
+are free to add css styling for your code as a final step yourself.
+
+
+License
+=======
+
+orgmode-cli-tools is free software licensed under the
+[GNU Affero General Public License (AGPL)](http://www.gnu.org/licenses/agpl-3.0.html).

data/Rakefile

@@ -0,0 +1,7 @@
+require "bundler/gem_tasks"
+require 'rake/testtask'
+
+Rake::TestTask.new do |i|
+  i.test_files = FileList['test/test_*.rb']
+  #i.verbose = true
+end

data/bin/org2html

@@ -0,0 +1,66 @@
+#!/usr/bin/env ruby
+
+# TODO add CLI flags to toggle:
+# t, --include-toc
+# s, --include-section-numbering
+# h N, --headline-levels=N
+# v, --version
+
+# TODO check what fresh user needs to install to make it work from
+# cold start in bare emacs 24 install
+
+def elisp_code(src_dir)
+  <<ELISP
+(package-initialize)
+(require 'org-publish)
+(require 'htmlize)
+
+(setq org-export-htmlize-output-type 'css)
+
+(org-publish '("org2html" :base-directory "#{src_dir}"
+	       :publishing-function org-publish-org-to-html
+	       :publishing-directory "/tmp"
+	       :base-extension "org"
+               :html-extension "html"
+	       :recursive t
+	       :html-preamble nil
+	       :html-postamble nil
+	       :table-of-contents nil
+	       :headline-levels 3
+	       :htmlized-source t
+	       :section-numbers nil
+	       :body-only nil) nil)
+ELISP
+end
+
+if ARGV.size == 0 || ARGV.size > 2
+  puts "Usage: org2html ORG_FILE_PATH [HTML_FILE_PATH]"
+  exit 1
+end
+
+if !File.exists?(ARGV[0])
+  puts "No such source org-file: #{ARGV[0]}"
+end
+
+src_file = ARGV[0]
+dest_file = ARGV[1] || src_file.gsub(".org", ".html")
+
+src_dir = File.dirname(File.expand_path(src_file))
+dest_dir = File.dirname(File.expand_path(dest_file))
+
+src_basefilename = File.basename(src_file)
+src_generated_name = src_basefilename.gsub(".org", ".html")
+dest_filepath = File.expand_path(File.basename(dest_file))
+
+require 'tempfile' # use tempfile to make this thread-safe
+elisp_file = Tempfile.new('foo')
+begin
+  elisp_file.write(elisp_code(src_dir))
+  elisp_file.close
+  `rm -rf ~/.org-timestamps/org2html.cache`
+  `emacs --batch -l #{elisp_file.path}`
+  `cp /tmp/#{src_generated_name} #{dest_filepath}`
+ensure
+  elisp_file.close
+  elisp_file.unlink # deletes the temp file
+end

data/bin/org2revealjs

@@ -0,0 +1,116 @@
+#!/usr/bin/env ruby
+
+def body(orgfile_path)
+  `cat #{orgfile_path}`
+end
+
+def title(orgfile_path)
+  `cat #{orgfile_path} | grep "#+TITLE:" `.gsub("#+TITLE:", "").strip
+end
+
+def transform_divs_into_sections(html_markup)
+  require 'nokogiri'
+  doc = Nokogiri::HTML(html_markup)
+  doc.css("#preamble").remove
+  doc.css("style").remove
+  doc.css(".title").remove
+  doc.css("head").remove
+  doc.css("#table-of-contents").remove
+  doc.css("div").each do |node|
+    node.node_name = "section"
+  end
+  doc.css("#content").inner_html
+end
+
+def slide_layout(title, body)
+  <<MARKUP
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>#{title}</title>
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
+    <link href='http://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
+    <link rel="stylesheet" href="css/main.css">
+    <link rel="stylesheet" href="css/theme/default.css">
+    <!-- For syntax highlighting -->
+    <link rel="stylesheet" href="lib/css/zenburn.css">
+    <script>
+      // If the query includes 'print-pdf' we'll use the PDF print sheet
+      document.write( '<link rel="stylesheet" href="css/print/' + ( window.location.search.match( /print-pdf/gi ) ? 'pdf' : 'paper' ) + '.css" type="text/css" media="print">' );
+    </script>
+    <!--[if lt IE 9]>
+        <script src="lib/js/html5shiv.js"></script>
+    <![endif]-->
+  </head>
+  <body>
+    <div class="reveal">
+      <!-- Used to fade in a background when a specific slide state is reached -->
+      <div class="state-background"></div>
+
+      <!-- Any section element inside of this container is displayed as a slide -->
+      <div class="slides">
+
+      #{body}
+
+      </div>
+
+      <!-- The navigational controls UI -->
+      <aside class="controls">
+        <a class="left" href="#">&#x25C4;</a>
+        <a class="right" href="#">&#x25BA;</a>
+        <a class="up" href="#">&#x25B2;</a>
+        <a class="down" href="#">&#x25BC;</a>
+      </aside>
+      <!-- Presentation progress bar -->
+      <div class="progress"><span></span></div>
+    </div>
+    <script src="lib/js/head.min.js"></script>
+    <script src="js/reveal.min.js"></script>
+    <script>
+      // Full list of configuration options available here:
+      // https://github.com/hakimel/reveal.js#configuration
+      Reveal.initialize({
+          controls: true,
+          progress: true,
+          history: true,
+          transition: Reveal.getQueryHash().transition || 'linear', // default/cube/page/concave/linear(2d)
+          // Optional libraries used to extend on reveal.js
+          dependencies: [
+              { src: 'lib/js/highlight.js', async: true, callback: function() { window.hljs.initHighlightingOnLoad(); } },
+              { src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
+              { src: 'lib/js/showdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
+              { src: 'lib/js/data-markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
+              { src: 'socket.io/socket.io.js', async: true, condition: function() { return window.location.host === 'localhost:1947'; } },
+              { src: 'plugin/speakernotes/client.js', async: true, condition: function() { return window.location.host === 'localhost:1947'; } },
+          ]
+      });
+    </script>
+  </body>
+</html>
+MARKUP
+end
+
+def convert(orgfile_path)
+  title = "" # TODO derive title from filename and|or org contents
+  puts `org2html #{orgfile_path}`
+  htmlfile_path = orgfile_path.gsub(".org", ".html")
+  body = body(htmlfile_path)
+  body = transform_divs_into_sections(body)
+  body = slide_layout(title, body)
+
+  # TODO use path of this file to find dir of template dir where gem is actually located
+
+  gem_root_path = File.expand_path(File.dirname(__FILE__))+"/.."
+  `cp -r #{gem_root_path}/templates/reveal_js_template generated_slides`
+  File.open("generated_slides/index.html", 'w') { |file| file.write(body) }
+  `rm #{htmlfile_path}`
+end
+
+if ARGV.length != 1
+  puts "Usage: org2revealjs ORG_FILE_PATH"
+  exit 1
+end
+
+convert(ARGV[0])

data/lib/orgmode_cli_tools.rb

@@ -0,0 +1,6 @@
+# -*- coding: utf-8 -*-
+module OrgmodeCliTools
+
+  VERSION = "0.1.0"
+
+end

data/orgmode-cli-tools.gemspec

@@ -0,0 +1,26 @@
+# -*- encoding: utf-8 -*-
+$:.push File.expand_path("../lib", __FILE__)
+require "orgmode_cli_tools"
+
+Gem::Specification.new do |s|
+  s.name        = "orgmode-cli-tools"
+  s.version     = OrgmodeCliTools::VERSION
+  s.authors     = ["Thomas Kjeldahl Nilsson"]
+  s.email       = ["thomas@kjeldahlnilsson.net"]
+  s.homepage    = "https://kjeldahlnilsson.net"
+  s.summary     = %q{CLI convenience tools for Org Mode files}
+  s.description = %q{CLI convenience tools for Org Mode files}
+
+  s.rubyforge_project = "orgmode-cli-tools"
+
+  s.files         = `git ls-files`.split("\n")
+  s.test_files    = `git ls-files -- {test,spec,features}/*`.split("\n")
+  s.executables   = `git ls-files -- bin/*`.split("\n").map{ |f| File.basename(f) }
+  s.require_paths = ["lib"]
+
+  s.add_runtime_dependency "nokogiri"
+
+  s.add_development_dependency "minitest"
+  s.add_development_dependency "shoulda"
+  s.add_development_dependency "shoulda-context"
+end

data/templates/reveal_js_template/css/google-fonts.css

@@ -0,0 +1,24 @@
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 700;
+  src: local('Lato Bold'), local('Lato-Bold'), url(FMtZSYIYoYw.ttf) format('truetype');
+}
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 400;
+  src: local('Lato Italic'), local('Lato-Italic'), url(LqowQDslGv4DmUBAfWa2Vw.ttf) format('truetype');
+}
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 700;
+  src: local('Lato Bold Italic'), local('Lato-BoldItalic'), url(cDxXwCLxiixG1c.ttf) format('truetype');
+}
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Lato Regular'), local('Lato-Regular'), url(v0SdcGFAl2aezM9Vq_aFTQ.ttf) format('truetype');
+}

data/templates/reveal_js_template/css/main.css

@@ -0,0 +1,909 @@
+@charset "UTF-8";
+
+/**
+ * reveal.js
+ * http://lab.hakim.se/reveal-js
+ * MIT licensed
+ *
+ * Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se
+ */
+
+
+/*********************************************
+ * RESET STYLES
+ *********************************************/
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+        margin: 0;
+        padding: 0;
+        border: 0;
+        font-size: 100%;
+        font: inherit;
+        vertical-align: baseline;
+}
+
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+        display: block;
+}
+
+
+/*********************************************
+ * GLOBAL STYLES
+ *********************************************/
+
+html,
+body {
+        padding: 0;
+        margin: 0;
+        width: 100%;
+        height: 100%;
+        min-height: 600px;
+        overflow: hidden;
+}
+
+body {
+        position: relative;
+        line-height: 1;
+}
+
+@media screen and (max-width: 900px) {
+        body {
+                font-size: 30px;
+        }
+}
+
+::selection {
+        background:#FF5E99;
+        color:#fff;
+        text-shadow: none;
+}
+
+/*********************************************
+ * HEADERS
+ *********************************************/
+
+.reveal h1 { font-size: 3.77em; }
+.reveal h2 { font-size: 2.11em; }
+.reveal h3 { font-size: 1.55em; }
+.reveal h4 { font-size: 1em;    }
+
+
+/*********************************************
+ * VIEW FRAGMENTS
+ *********************************************/
+
+.reveal .slides section .fragment {
+        opacity: 0;
+
+        -webkit-transition: all .2s ease;
+           -moz-transition: all .2s ease;
+            -ms-transition: all .2s ease;
+             -o-transition: all .2s ease;
+                transition: all .2s ease;
+}
+        .reveal .slides section .fragment.visible {
+                opacity: 1;
+        }
+
+
+/*********************************************
+ * DEFAULT ELEMENT STYLES
+ *********************************************/
+
+.reveal .slides section {
+        line-height: 1.2em;
+        font-weight: normal;
+}
+
+.reveal img {
+        /* preserve aspect ratio and scale image so it's bound within the section */
+        max-width: 100%;
+        max-height: 100%;
+}
+
+.reveal strong,
+.reveal b {
+        font-weight: bold;
+}
+
+.reveal em,
+.reveal i {
+        font-style: italic;
+}
+
+.reveal ol,
+.reveal ul {
+        display: inline-block;
+
+        text-align: left;
+        margin: 0 0 0 1em;
+}
+
+.reveal ol {
+        list-style-type: decimal;
+}
+
+.reveal ul {
+        list-style-type: disc;
+}
+
+.reveal ul ul {
+        list-style-type: square;
+}
+
+.reveal ul ul ul {
+        list-style-type: circle;
+}
+
+.reveal ul ul,
+.reveal ul ol,
+.reveal ol ol,
+.reveal ol ul {
+        display: block;
+        margin-left: 40px;
+}
+
+.reveal p {
+        margin-bottom: 10px;
+        line-height: 1.2em;
+}
+
+.reveal q,
+.reveal blockquote {
+        quotes: none;
+}
+
+.reveal blockquote {
+        display: block;
+        position: relative;
+        width: 70%;
+        margin: 5px auto;
+        padding: 5px;
+
+        font-style: italic;
+        background: rgba(255, 255, 255, 0.05);
+        box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
+}
+        .reveal blockquote:before {
+                content: '“';
+        }
+        .reveal blockquote:after {
+                content: '”';
+        }
+
+.reveal q {
+        font-style: italic;
+}
+        .reveal q:before {
+                content: '“';
+        }
+        .reveal q:after {
+                content: '”';
+        }
+
+.reveal pre {
+        display: block;
+        position: relative;
+        width: 90%;
+        margin: 10px auto;
+
+        text-align: left;
+        font-size: 0.55em;
+        font-family: monospace;
+        line-height: 1.2em;
+
+        word-wrap: break-word;
+
+        box-shadow: 0px 0px 6px rgba(0,0,0,0.3);
+}
+
+.reveal code {
+        font-family: monospace;
+        overflow-x: auto;
+}
+
+.reveal table th,
+.reveal table td {
+        text-align: left;
+        padding-right: .3em;
+}
+
+.reveal table th {
+        text-shadow: rgb(255,255,255) 1px 1px 2px;
+}
+
+.reveal sup {
+        vertical-align: super;
+}
+.reveal sub {
+        vertical-align: sub;
+}
+
+.reveal small {
+        font-size: 0.6em;
+        line-height: 1em;
+        vertical-align: top;
+}
+
+.reveal small * {
+        vertical-align: top;
+}
+
+
+/*********************************************
+ * CONTROLS
+ *********************************************/
+
+.reveal .controls {
+        display: none;
+        position: fixed;
+        width: 100px;
+        height: 100px;
+        z-index: 30;
+
+        right: 0;
+        bottom: 0;
+}
+
+        .reveal .controls a {
+                font-family: Arial;
+                font-size: 0.83em;
+                position: absolute;
+                opacity: 0.1;
+        }
+                .reveal .controls a.enabled {
+                        opacity: 0.6;
+                }
+                .reveal .controls a.enabled:active {
+                        margin-top: 1px;
+                }
+
+        .reveal .controls .left {
+                top: 30px;
+        }
+
+        .reveal .controls .right {
+                left: 60px;
+                top: 30px;
+        }
+
+        .reveal .controls .up {
+                left: 30px;
+        }
+
+        .reveal .controls .down {
+                left: 30px;
+                top: 60px;
+        }
+
+
+/*********************************************
+ * PROGRESS BAR
+ *********************************************/
+
+.reveal .progress {
+        position: fixed;
+        display: none;
+        height: 3px;
+        width: 100%;
+        bottom: 0;
+        left: 0;
+}
+
+        .reveal .progress span {
+                display: block;
+                height: 100%;
+                width: 0px;
+
+                -webkit-transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
+                   -moz-transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
+                    -ms-transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
+                     -o-transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
+                        transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
+        }
+
+/*********************************************
+ * ROLLING LINKS
+ *********************************************/
+/*
+.reveal .roll {
+        display: inline-block;
+        line-height: 1.2;
+        overflow: hidden;
+
+        vertical-align: top;
+
+        -webkit-perspective: 400px;
+           -moz-perspective: 400px;
+            -ms-perspective: 400px;
+                perspective: 400px;
+
+        -webkit-perspective-origin: 50% 50%;
+           -moz-perspective-origin: 50% 50%;
+            -ms-perspective-origin: 50% 50%;
+                perspective-origin: 50% 50%;
+}
+        .reveal .roll:hover {
+                background: none;
+                text-shadow: none;
+        }
+.reveal .roll span {
+        display: block;
+        position: relative;
+        padding: 0 2px;
+
+        pointer-events: none;
+
+        -webkit-transition: all 400ms ease;
+           -moz-transition: all 400ms ease;
+            -ms-transition: all 400ms ease;
+                transition: all 400ms ease;
+
+        -webkit-transform-origin: 50% 0%;
+           -moz-transform-origin: 50% 0%;
+            -ms-transform-origin: 50% 0%;
+                transform-origin: 50% 0%;
+
+        -webkit-transform-style: preserve-3d;
+           -moz-transform-style: preserve-3d;
+            -ms-transform-style: preserve-3d;
+                transform-style: preserve-3d;
+
+        -webkit-backface-visibility: hidden;
+           -moz-backface-visibility: hidden;
+                backface-visibility: hidden;
+}
+        .reveal .roll:hover span {
+            background: rgba(0,0,0,0.5);
+
+            -webkit-transform: translate3d( 0px, 0px, -45px ) rotateX( 90deg );
+               -moz-transform: translate3d( 0px, 0px, -45px ) rotateX( 90deg );
+                -ms-transform: translate3d( 0px, 0px, -45px ) rotateX( 90deg );
+                    transform: translate3d( 0px, 0px, -45px ) rotateX( 90deg );
+        }
+.reveal .roll span:after {
+        content: attr(data-title);
+
+        display: block;
+        position: absolute;
+        left: 0;
+        top: 0;
+        padding: 0 2px;
+
+        -webkit-transform-origin: 50% 0%;
+           -moz-transform-origin: 50% 0%;
+            -ms-transform-origin: 50% 0%;
+                transform-origin: 50% 0%;
+
+        -webkit-transform: translate3d( 0px, 110%, 0px ) rotateX( -90deg );
+           -moz-transform: translate3d( 0px, 110%, 0px ) rotateX( -90deg );
+            -ms-transform: translate3d( 0px, 110%, 0px ) rotateX( -90deg );
+                transform: translate3d( 0px, 110%, 0px ) rotateX( -90deg );
+}
+
+
+/*********************************************
+ * SLIDES
+ *********************************************/
+
+.reveal .slides {
+        position: absolute;
+        max-width: 900px;
+        width: 80%;
+        height: 60%;
+        left: 50%;
+        top: 50%;
+        margin-top: -320px;
+        padding: 20px 0px;
+        overflow: visible;
+
+        text-align: center;
+
+        -webkit-transition: -webkit-perspective .4s ease;
+           -moz-transition: -moz-perspective .4s ease;
+            -ms-transition: -ms-perspective .4s ease;
+             -o-transition: -o-perspective .4s ease;
+                transition: perspective .4s ease;
+
+        -webkit-perspective: 600px;
+           -moz-perspective: 600px;
+            -ms-perspective: 600px;
+                perspective: 600px;
+
+        -webkit-perspective-origin: 0% 25%;
+           -moz-perspective-origin: 0% 25%;
+            -ms-perspective-origin: 0% 25%;
+                perspective-origin: 0% 25%;
+}
+
+.reveal .slides>section,
+.reveal .slides>section>section {
+        display: none;
+        position: absolute;
+        width: 100%;
+        min-height: 600px;
+
+        z-index: 10;
+
+        -webkit-transform-style: preserve-3d;
+           -moz-transform-style: preserve-3d;
+            -ms-transform-style: preserve-3d;
+                transform-style: preserve-3d;
+
+        -webkit-transition: all 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
+           -moz-transition: all 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
+            -ms-transition: all 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
+             -o-transition: all 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
+                transition: all 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
+}
+
+.reveal .slides>section.present {
+        display: block;
+        z-index: 11;
+        opacity: 1;
+}
+
+.reveal .slides>section {
+        margin-left: -50%;
+}
+
+
+/*********************************************
+ * DEFAULT TRANSITION
+ *********************************************/
+
+.reveal .slides>section.past {
+        display: block;
+        opacity: 0;
+
+        -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0);
+           -moz-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0);
+            -ms-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0);
+                transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0);
+}
+.reveal .slides>section.future {
+        display: block;
+        opacity: 0;
+
+        -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0);
+           -moz-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0);
+            -ms-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0);
+                transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0);
+}
+
+.reveal .slides>section>section.past {
+        display: block;
+        opacity: 0;
+
+        -webkit-transform: translate3d(0, -50%, 0) rotateX(70deg) translate3d(0, -50%, 0);
+           -moz-transform: translate3d(0, -50%, 0) rotateX(70deg) translate3d(0, -50%, 0);
+            -ms-transform: translate3d(0, -50%, 0) rotateX(70deg) translate3d(0, -50%, 0);
+                transform: translate3d(0, -50%, 0) rotateX(70deg) translate3d(0, -50%, 0);
+}
+.reveal .slides>section>section.future {
+        display: block;
+        opacity: 0;
+
+        -webkit-transform: translate3d(0, 50%, 0) rotateX(-70deg) translate3d(0, 50%, 0);
+           -moz-transform: translate3d(0, 50%, 0) rotateX(-70deg) translate3d(0, 50%, 0);
+            -ms-transform: translate3d(0, 50%, 0) rotateX(-70deg) translate3d(0, 50%, 0);
+                transform: translate3d(0, 50%, 0) rotateX(-70deg) translate3d(0, 50%, 0);
+}
+
+
+/*********************************************
+ * CONCAVE TRANSITION
+ *********************************************/
+
+.reveal.concave  .slides>section.past {
+        -webkit-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0);
+           -moz-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0);
+            -ms-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0);
+                transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0);
+}
+.reveal.concave  .slides>section.future {
+        -webkit-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0);
+           -moz-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0);
+            -ms-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0);
+                transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0);
+}
+
+.reveal.concave  .slides>section>section.past {
+        -webkit-transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0);
+           -moz-transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0);
+            -ms-transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0);
+                transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0);
+}
+.reveal.concave  .slides>section>section.future {
+        -webkit-transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0);
+           -moz-transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0);
+            -ms-transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0);
+                transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0);
+}
+
+
+/*********************************************
+ * LINEAR TRANSITION
+ *********************************************/
+
+.reveal.linear .slides>section.past {
+        -webkit-transform: translate(-150%, 0);
+           -moz-transform: translate(-150%, 0);
+            -ms-transform: translate(-150%, 0);
+             -o-transform: translate(-150%, 0);
+                transform: translate(-150%, 0);
+}
+.reveal.linear .slides>section.future {
+        -webkit-transform: translate(150%, 0);
+           -moz-transform: translate(150%, 0);
+            -ms-transform: translate(150%, 0);
+             -o-transform: translate(150%, 0);
+                transform: translate(150%, 0);
+}
+
+.reveal.linear .slides>section>section.past {
+        -webkit-transform: translate(0, -150%);
+           -moz-transform: translate(0, -150%);
+            -ms-transform: translate(0, -150%);
+             -o-transform: translate(0, -150%);
+                transform: translate(0, -150%);
+}
+.reveal.linear .slides>section>section.future {
+        -webkit-transform: translate(0, 150%);
+           -moz-transform: translate(0, 150%);
+            -ms-transform: translate(0, 150%);
+             -o-transform: translate(0, 150%);
+                transform: translate(0, 150%);
+}
+
+/*********************************************
+ * BOX TRANSITION
+ *********************************************/
+
+.reveal.cube .slides {
+        margin-top: -350px;
+
+        -webkit-perspective-origin: 50% 25%;
+           -moz-perspective-origin: 50% 25%;
+            -ms-perspective-origin: 50% 25%;
+                perspective-origin: 50% 25%;
+
+        -webkit-perspective: 1300px;
+           -moz-perspective: 1300px;
+            -ms-perspective: 1300px;
+                perspective: 1300px;
+}
+
+.reveal.cube .slides section {
+        padding: 30px;
+
+        -webkit-backface-visibility: hidden;
+           -moz-backface-visibility: hidden;
+            -ms-backface-visibility: hidden;
+                backface-visibility: hidden;
+
+        -webkit-box-sizing: border-box;
+           -moz-box-sizing: border-box;
+                box-sizing: border-box;
+}
+        .reveal.cube .slides section:not(.stack):before {
+                content: '';
+                position: absolute;
+                display: block;
+                width: 100%;
+                height: 100%;
+                left: 0;
+                top: 0;
+                background: #232628;
+                border-radius: 4px;
+
+                -webkit-transform: translateZ( -20px );
+                   -moz-transform: translateZ( -20px );
+                    -ms-transform: translateZ( -20px );
+                     -o-transform: translateZ( -20px );
+                        transform: translateZ( -20px );
+        }
+        .reveal.cube .slides section:not(.stack):after {
+                content: '';
+                position: absolute;
+                display: block;
+                width: 90%;
+                height: 30px;
+                left: 5%;
+                bottom: 0;
+                background: none;
+                z-index: 1;
+
+                border-radius: 4px;
+                box-shadow: 0px 95px 25px rgba(0,0,0,0.2);
+
+                -webkit-transform: translateZ(-90px) rotateX( 65deg );
+                   -moz-transform: translateZ(-90px) rotateX( 65deg );
+                    -ms-transform: translateZ(-90px) rotateX( 65deg );
+                     -o-transform: translateZ(-90px) rotateX( 65deg );
+                        transform: translateZ(-90px) rotateX( 65deg );
+        }
+
+.reveal.cube .slides>section.stack {
+        padding: 0;
+        background: none;
+}
+
+.reveal.cube .slides>section.past {
+        -webkit-transform-origin: 100% 0%;
+           -moz-transform-origin: 100% 0%;
+            -ms-transform-origin: 100% 0%;
+                transform-origin: 100% 0%;
+
+        -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg);
+           -moz-transform: translate3d(-100%, 0, 0) rotateY(-90deg);
+            -ms-transform: translate3d(-100%, 0, 0) rotateY(-90deg);
+                transform: translate3d(-100%, 0, 0) rotateY(-90deg);
+}
+
+.reveal.cube .slides>section.future {
+        -webkit-transform-origin: 0% 0%;
+           -moz-transform-origin: 0% 0%;
+            -ms-transform-origin: 0% 0%;
+                transform-origin: 0% 0%;
+
+        -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg);
+           -moz-transform: translate3d(100%, 0, 0) rotateY(90deg);
+            -ms-transform: translate3d(100%, 0, 0) rotateY(90deg);
+                transform: translate3d(100%, 0, 0) rotateY(90deg);
+}
+
+.reveal.cube .slides>section>section.past {
+        -webkit-transform-origin: 0% 100%;
+           -moz-transform-origin: 0% 100%;
+            -ms-transform-origin: 0% 100%;
+                transform-origin: 0% 100%;
+
+        -webkit-transform: translate3d(0, -100%, 0) rotateX(90deg);
+           -moz-transform: translate3d(0, -100%, 0) rotateX(90deg);
+            -ms-transform: translate3d(0, -100%, 0) rotateX(90deg);
+                transform: translate3d(0, -100%, 0) rotateX(90deg);
+}
+
+.reveal.cube .slides>section>section.future {
+        -webkit-transform-origin: 0% 0%;
+           -moz-transform-origin: 0% 0%;
+            -ms-transform-origin: 0% 0%;
+                transform-origin: 0% 0%;
+
+        -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg);
+           -moz-transform: translate3d(0, 100%, 0) rotateX(-90deg);
+            -ms-transform: translate3d(0, 100%, 0) rotateX(-90deg);
+                transform: translate3d(0, 100%, 0) rotateX(-90deg);
+}
+
+
+/*********************************************
+ * PAGE TRANSITION
+ *********************************************/
+
+.reveal.page .slides {
+        margin-top: -350px;
+
+        -webkit-perspective-origin: 50% 50%;
+           -moz-perspective-origin: 50% 50%;
+            -ms-perspective-origin: 50% 50%;
+                perspective-origin: 50% 50%;
+
+        -webkit-perspective: 3000px;
+           -moz-perspective: 3000px;
+            -ms-perspective: 3000px;
+                perspective: 3000px;
+}
+
+.reveal.page .slides section {
+        padding: 30px;
+
+        -webkit-box-sizing: border-box;
+           -moz-box-sizing: border-box;
+                box-sizing: border-box;
+}
+        .reveal.page .slides section.past {
+                z-index: 12;
+        }
+        .reveal.page .slides section:not(.stack):before {
+                content: '';
+                position: absolute;
+                display: block;
+                width: 100%;
+                height: 100%;
+                left: 0;
+                top: 0;
+                background: rgba(0,0,0,0.2);
+
+                -webkit-transform: translateZ( -20px );
+                   -moz-transform: translateZ( -20px );
+                    -ms-transform: translateZ( -20px );
+                     -o-transform: translateZ( -20px );
+                        transform: translateZ( -20px );
+        }
+        .reveal.page .slides section:not(.stack):after {
+                content: '';
+                position: absolute;
+                display: block;
+                width: 90%;
+                height: 30px;
+                left: 5%;
+                bottom: 0;
+                background: none;
+                z-index: 1;
+
+                border-radius: 4px;
+                box-shadow: 0px 95px 25px rgba(0,0,0,0.2);
+
+                -webkit-transform: translateZ(-90px) rotateX( 65deg );
+        }
+
+.reveal.page .slides>section.stack {
+        padding: 0;
+        background: none;
+}
+
+.reveal.page .slides>section.past {
+        -webkit-transform-origin: 0% 0%;
+           -moz-transform-origin: 0% 0%;
+            -ms-transform-origin: 0% 0%;
+                transform-origin: 0% 0%;
+
+        -webkit-transform: translate3d(-40%, 0, 0) rotateY(-80deg);
+           -moz-transform: translate3d(-40%, 0, 0) rotateY(-80deg);
+            -ms-transform: translate3d(-40%, 0, 0) rotateY(-80deg);
+                transform: translate3d(-40%, 0, 0) rotateY(-80deg);
+}
+
+.reveal.page .slides>section.future {
+        -webkit-transform-origin: 100% 0%;
+           -moz-transform-origin: 100% 0%;
+            -ms-transform-origin: 100% 0%;
+                transform-origin: 100% 0%;
+
+        -webkit-transform: translate3d(0, 0, 0);
+           -moz-transform: translate3d(0, 0, 0);
+            -ms-transform: translate3d(0, 0, 0);
+                transform: translate3d(0, 0, 0);
+}
+
+.reveal.page .slides>section>section.past {
+        -webkit-transform-origin: 0% 0%;
+           -moz-transform-origin: 0% 0%;
+            -ms-transform-origin: 0% 0%;
+                transform-origin: 0% 0%;
+
+        -webkit-transform: translate3d(0, -40%, 0) rotateX(80deg);
+           -moz-transform: translate3d(0, -40%, 0) rotateX(80deg);
+            -ms-transform: translate3d(0, -40%, 0) rotateX(80deg);
+                transform: translate3d(0, -40%, 0) rotateX(80deg);
+}
+
+.reveal.page .slides>section>section.future {
+        -webkit-transform-origin: 0% 100%;
+           -moz-transform-origin: 0% 100%;
+            -ms-transform-origin: 0% 100%;
+                transform-origin: 0% 100%;
+
+        -webkit-transform: translate3d(0, 0, 0);
+           -moz-transform: translate3d(0, 0, 0);
+            -ms-transform: translate3d(0, 0, 0);
+                transform: translate3d(0, 0, 0);
+}
+
+
+/*********************************************
+ * OVERVIEW
+ *********************************************/
+
+.reveal.overview .slides {
+        -webkit-perspective: 700px;
+           -moz-perspective: 700px;
+            -ms-perspective: 700px;
+                perspective: 700px;
+}
+
+.reveal.overview .slides section {
+        padding: 20px 0;
+        max-height: 600px;
+        overflow: hidden;
+        opacity: 1;
+        cursor: pointer;
+        background: rgba(0,0,0,0.1);
+}
+.reveal.overview .slides section .fragment {
+        opacity: 1;
+}
+.reveal.overview .slides section:after,
+.reveal.overview .slides section:before {
+        display: none !important;
+}
+.reveal.overview .slides section>section {
+        opacity: 1;
+        cursor: pointer;
+}
+        .reveal.overview .slides section:hover {
+                background: rgba(0,0,0,0.3);
+        }
+
+        .reveal.overview .slides section.present {
+                background: rgba(0,0,0,0.3);
+        }
+.reveal.overview .slides>section.stack {
+        background: none;
+        padding: 0;
+        overflow: visible;
+}
+
+
+/*********************************************
+ * FALLBACK
+ *********************************************/
+
+.no-transforms {
+        overflow-y: auto;
+}
+
+.no-transforms .slides section {
+        display: block!important;
+        opacity: 1!important;
+        position: relative!important;
+        height: auto;
+        min-height: auto;
+        margin-bottom: 100px;
+
+        -webkit-transform: none;
+           -moz-transform: none;
+            -ms-transform: none;
+                transform: none;
+}
+
+
+/*********************************************
+ * DEFAULT STATES
+ *********************************************/
+
+.state-background {
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        background: rgba( 0, 0, 0, 0 );
+
+        -webkit-transition: background 800ms ease;
+           -moz-transition: background 800ms ease;
+            -ms-transition: background 800ms ease;
+             -o-transition: background 800ms ease;
+                transition: background 800ms ease;
+}
+.alert .state-background {
+        background: rgba( 200, 50, 30, 0.6 );
+}
+.soothe .state-background {
+        background: rgba( 50, 200, 90, 0.4 );
+}
+.blackout .state-background {
+        background: rgba( 0, 0, 0, 0.6 );
+}
+
+
+/*********************************************
+ * SPEAKER NOTES
+ *********************************************/
+
+.reveal aside.notes {
+        display: none;
+}