slide-em-up 0.2.4 → 0.3.0

data/README.md

@@ -38,6 +38,15 @@ How to do your first presentation with Slide'em up?
 8. Use the arrows keys to navigate between the slides
 
 
+Themes
+------
+
+Several themes are available: `io2012`, `shower`, `3d_slideshow`, `reveal`,
+`html5rocks`, `CSSS` and `memories`. To choose the theme for your
+presentation, edit the `presentation.json` file and change the `"theme"`
+element.
+
+
 Markup for the slides
 ---------------------
 
@@ -82,14 +91,6 @@ like this:
     ```
 
 
-Themes
-------
-
-Several themes are available: shower, 3d_slideshow, html5rocks, CSSS
-and memories. To choose the theme for your presentation, edit the
-`presentation.json` file and change the `"theme"` element.
-
-
 Remote Control
 --------------
 
@@ -111,16 +112,6 @@ setting the `APIKEY` environment variable:
     APIKEY=foobar slide-em-up
 
 
-TODO
-----
-
-* Same command line stuff than showoff
-* Add a showoff theme for compatibility
-* Many more themes and features
-* Favicon
-* Optimize process_code (pygments.rb?)
-
-
 Issues or Suggestions
 ---------------------
 
@@ -129,21 +120,23 @@ Found an issue or have a suggestion? Please report it on
 
 If you wants to make a pull request, please check the specs before:
 
-    ./spec/slide-em-up_spec.rb
+    bundle exec spec/slide-em-up_spec.rb
 
 
 Credits
 -------
 
 Scott Chacon is the guy who made [ShowOff](https://github.com/schacon/showoff).
-Slide'em up is only a copy of ShowOff, where sinatra was replaced by Goliath.
+Slide'em up is only a copy of ShowOff with multiple themes and sinatra
+replaced by Goliath.
 
 Themes were picked from the internet. Thanks to:
 
-- Hakim El Hattab for 3d_slideshow
+- Hakim El Hattab for 3d_slideshow and reveal
 - Google for html5rocks
 - Vadim Makeev for shower
-- Lea Verou for CSSS
+- Lea Verou for CSSS (and its modified version, memories)
+- Google for io2012
 
-Copyright (c) 2011 Bruno Michel <bruno.michel@af83.com>
+♡2011 by Bruno Michel. Copying is an act of love. Please copy and share.
 Released under the MIT license

data/lib/slide-em-up.rb

@@ -1,4 +1,5 @@
 module SlideEmUp
+  autoload :Markdown,        "slide-em-up/markdown"
   autoload :Presentation,    "slide-em-up/presentation"
   autoload :SlidesAPI,       "slide-em-up/slides_api"
   autoload :RemoteAPI,       "slide-em-up/remote_api"

data/lib/slide-em-up/markdown.rb

@@ -0,0 +1,41 @@
+# Encoding: utf-8
+require "albino"
+require "redcarpet"
+
+
+module SlideEmUp
+  class Markdown < Redcarpet::Render::HTML
+    PARSER_OPTIONS = {
+      :no_intra_emphasis  => true,
+      :tables             => true,
+      :fenced_code_blocks => true,
+      :autolink           => true,
+      :strikethrough      => true,
+      :superscript        => true
+    }
+
+    def self.render(text)
+      text ||= ""
+      markdown = Redcarpet::Markdown.new(self, PARSER_OPTIONS)
+      markdown.render(text)
+    end
+
+    def block_code(code, lang)
+      colorized = Albino.new(code, lang || "text").colorize(:P => "nowrap")
+      "<pre><code class=\"#{lang}\">#{colorized}</code></pre>"
+    end
+
+    def strikethrough(text)
+      "<s>#{text}</s>"
+    end
+
+    def normal_text(text)
+      text.gsub!('« ', '«&nbsp;')
+      text.gsub!(/ ([:;»!?])/, '&nbsp;\1')
+      text.gsub!(' -- ', '—')
+      text.gsub!('...', '…')
+      text
+    end
+
+  end
+end

data/lib/slide-em-up/presentation.rb

@@ -1,23 +1,27 @@
-require "albino"
-require "digest/sha1"
 require "erubis"
-require "redcarpet"
 require "yajl"
 
 
 module SlideEmUp
   class Presentation
-    Meta    = Struct.new(:title, :dir, :css, :js, :duration)
+    Meta    = Struct.new(:title, :dir, :css, :js, :author, :duration)
     Theme   = Struct.new(:title, :dir, :css, :js)
     Section = Struct.new(:number, :title, :dir, :slides)
-    Slide   = Struct.new(:number, :classes, :markdown, :html)
+
+    class Slide < Struct.new(:number, :classes, :html)
+      def extract_title
+        return @title if @title
+        html.sub!(/<h(\d)>(.*)<\/h\1>/) { @title = $2; "" }
+        @title
+      end
+    end
 
     attr_accessor :meta, :theme, :common, :parts
 
     def initialize(dir)
       infos   = extract_normal_infos(dir) || extract_infos_from_showoff(dir) || {}
       infos   = { "title" => "No title", "theme" => "shower", "duration" => 60 }.merge(infos)
-      @meta   = build_meta(infos["title"], dir, infos["duration"])
+      @meta   = build_meta(infos["title"], dir, infos["author"], infos["duration"])
       @theme  = build_theme(infos["theme"])
       @common = build_theme("common")
       @parts  = infos["sections"] || raise(Exception, "check your presentation.json or showoff.json file")
@@ -52,7 +56,7 @@ module SlideEmUp
       { "title" => infos["name"], "theme" => "showoff", "sections" => sections }
     end
 
-    def build_meta(title, dir, duration)
+    def build_meta(title, dir, author, duration)
       Meta.new.tap do |m|
         m.title = title
         m.dir   = dir
@@ -60,6 +64,7 @@ module SlideEmUp
           m.css = Dir["**/*.css"]
           m.js  = Dir["**/*.js"]
         end
+        m.author = author
         m.duration = duration
       end
     end
@@ -83,34 +88,11 @@ module SlideEmUp
         slides = parts.map.with_index do |slide,j|
           @codemap = {}
           classes, md = slide.split("\n", 2)
-          tmp  = extract_code(md)
-          html = Redcarpet.new(tmp).to_html
-          html = process_code(html)
-          Slide.new(j, classes, md, html)
+          html = Markdown.render(md)
+          Slide.new(j, classes, html)
         end
         Section.new(i, title, dir, slides)
       end
     end
-
-    # Code taken from gollum (http://github.com/github/gollum)
-    def extract_code(md)
-      md.gsub(/^``` ?(.+?)\r?\n(.+?)\r?\n```\r?$/m) do
-        id = Digest::SHA1.hexdigest($2)
-        @codemap[id] = { :lang => $1, :code => $2 }
-        id
-      end
-    end
-
-    def process_code(data)
-      @codemap.each do |id, spec|
-        lang, code = spec[:lang], spec[:code]
-        if code.lines.all? { |line| line =~ /\A\r?\n\Z/ || line =~ /^(    |\t)/ }
-          code.gsub!(/^(    |\t)/m, '')
-        end
-        output = Albino.new(code, lang).colorize(:P => "nowrap")
-        data.gsub!(id, "<pre><code class=\"#{lang}\">#{output}</code></pre>")
-      end
-      data
-    end
   end
 end

data/lib/slide-em-up/remote_api.rb

@@ -1,5 +1,6 @@
 require "goliath/api"
 
+
 module SlideEmUp
   class RemoteAPI < Goliath::API
     def initialize(key)
@@ -39,7 +40,7 @@ module SlideEmUp
       env['subscription'] = @chan.subscribe do |msg|
         env.stream_send("data: #{msg}\n\n")
       end
-      streaming_response(200, {"Content-Type" => "text/event-stream"})
+      streaming_response(202, {"Content-Type" => "text/event-stream"})
     end
 
     def forbidden

data/lib/slide-em-up/version.rb

@@ -1,3 +1,3 @@
 module SlideEmUp
-  VERSION = "0.2.4"
+  VERSION = "0.3.0"
 end

data/themes/CSSS/css/slideshow.css

@@ -10,16 +10,8 @@
 .slide,
 .delayed,
 .delayed-children > * {
-	-webkit-transition:1s;
-	-ms-transition:1s;
-	-moz-transition:1s;
-	-o-transition:1s;
-	transition:1s;
-	-moz-transition-property: -webkit-transform, opacity, left, top, right, bottom;
-	-ms-transition-property: -webkit-transform, opacity, left, top, right, bottom;
-	-o-transition-property: -webkit-transform, opacity, left, top, right, bottom;
-	-webkit-transition-property: -webkit-transform, opacity, left, top, right, bottom;
-	transition-property: -webkit-transform, opacity, left, top, right, bottom;
+	transition:.5s;
+	transition-property: transform, opacity, left, top, right, bottom, background;
 }
  
 /**
@@ -31,50 +23,40 @@
  }
  
  body {
- 	counter-reset: slide;
  	margin: 0;
  }
  
- .slide {
- 	visibility: hidden;
- 	position:absolute;
- 	top:0;
- 	right:0;
- 	bottom:0;
- 	left:0;
- 	z-index:1;
- 	
- 	font-size:250%;
- 	line-height:1.6;
- 	 	
- 	opacity:0;
- 	height:0;
- 	width:0;
- 	overflow:hidden;
- 	
- 	counter-increment: slide;
- }
+.slide {
+	display: none;
+	position:absolute;
+	top:0;
+	right:0;
+	bottom:0;
+	left:0;
+	z-index:1;
+	
+	font-size:250%;
+	line-height:1.6;
+}
  
  .slide.previous,
  .slide:target,
- .slide:target + .slide, /* just in case, not really needed */
  .slide.next {
- 	visibility: visible;
+	display: block;
+	opacity:0;
+	overflow:hidden;
  }
  
  .slide:target {
  	z-index:100;
  	opacity:1;
- 	height:auto;
- 	width: auto;
  	overflow: visible;
 }
 
 /**
 	Slide numbers
  */ 
-.slide:target::before {
-  	content: counter(slide);
+#indicator {
   	position: absolute;
   	top: .05in;
   	right: .5em;
@@ -88,12 +70,7 @@
   	text-align: center;
   	padding: .1em .3em 0;
   	min-width: 1.6em;
-  	-moz-box-sizing: border-box;
-  	-webkit-box-sizing: border-box;
   	box-sizing: border-box;
-  	
-  	-moz-border-radius: 999px;
-  	-webkit-border-radius: 999px;
   	border-radius: 999px;
 }
 
@@ -116,10 +93,48 @@
 .delayed.current,
 .delayed-children > .current,
 .delayed.displayed.non-dismissable,
-.delayed-children > .displayed.non-dismissable {
+.delayed-children > .displayed.non-dismissable, /* non-dismissable name is deprecated */
+.delayed.displayed.persistent,
+.delayed-children > .displayed.persistent,
+.delayed-children.persistent > .displayed {
 	opacity: 1;
 }
 
+/**
+	iframe slides
+ */
+.iframe.slide {
+	padding: 0 !important;
+	text-align: center;
+} 
+
+	.iframe.slide > h1 {
+		position: absolute;
+		bottom: 0; right: 0; left: 0;
+		background: rgba(0,0,0,.5);
+		font-size: 100%;
+	}
+	
+		.iframe.slide > h1 > a {
+			display: inline-block;
+			padding: .2em .5em;
+			
+			color: white;
+			text-align: center;
+			text-decoration: none;
+			text-shadow: 0 -.05em .05em black;
+		}
+	
+	.slide > iframe:only-of-type {
+		position: absolute;
+		top: 0;
+		left: 0;
+		border: 0;
+		width: 100%;
+		height: 100%;
+		margin: 0;
+	}
+
 /**
 	Show thumbnails
  */
@@ -132,9 +147,6 @@
 .presenter .slide.next {
 	width: 1024px;
 	height: 768px;
-	
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
 	box-sizing: border-box;
 	
 	float: left;
@@ -144,14 +156,7 @@
 	margin:-292px -395px;
 	cursor: pointer;
 	
-	-moz-transform: scale(.2, .2);
-	-o-transform: scale(.2, .2);
-	-webkit-transform: scale(.2, .2);
 	transform: scale(.2, .2);
-	
-	-webkit-transition:1s -webkit-transform;
-	-moz-transition:1s -moz-transform;
-	-o-transition:1s -o-transform;
 	transition:1s transform;
 }
 
@@ -172,7 +177,7 @@
 .show-thumbnails .slide:target,
 .presenter .slide:target + .slide {
 	outline: 20px solid rgba(255, 255, 255, .6);
-	-moz-outline-radius:5px;
+	outline-radius:5px;
 	
 	box-shadow: 5px 5px 10px black;
 }
@@ -198,46 +203,15 @@
 	font-size: 250%;
 	text-align: center;
 	text-shadow: .05em .05em .1em black;
-	
-	-moz-transform: none;
-	-ms-transform: none;
-	-o-transform: none;
-	-webkit-transform: none;
 	transform: none;
 }
 
 /* Hide all elements in slide by hitting Ctrl + J or Shift + J */
 .hide-elements .slide:target > * {
 	opacity: 0;
-	
-	-moz-transition:.5s;
-	-webkit-transition:.5s;
-	-o-transition:.5s;
 	transition:.5s;
 }
 
-/* Mark slides as incomplete to spot them easier */
-.incomplete.slide::after {
-	content: 'INCOMPLETE';
-	font-weight: bold;
-	position: absolute;
-	top: 40%;
-	left: 30%;
-	padding: .1em .4em 0;
-	border: .1em solid;
-	color: rgba(255, 0, 0, .8);
-	font-size: 140%;
-	
-	-moz-border-radius: .2em;
-	-webkit-border-radius: .2em;
-	border-radius: .2em;
-	
-	-moz-transform: rotate(30deg);
-	-o-transform: rotate(30deg);
-	-webkit-transform: rotate(30deg);
-	transform: rotate(30deg);
-}
-
 /* Timer */
 
 #timer {
@@ -252,50 +226,25 @@
 	background:rgba(0,0,0,.5);
 	overflow: hidden;
 	text-align: right;
-	
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
 	box-sizing: border-box;
+	transition: linear;
 }
 
-#timer:before {
-	content: 'Progress ';
-	text-transform: uppercase;
-	color: white;
-	font-size: 9px;
-}
+	#timer:before {
+		content: 'Progress ';
+		text-transform: uppercase;
+		color: white;
+		font-size: 9px;
+	}
 
 #timer.end {
 	width: 100%;
 }
 
-/* Ribbon */
-[data-type].slide:not(.hide-ribbon):after {
-	content: attr(data-type);
-	position: fixed;
-	top: 0;
+#timer.end.overtime {
+	width: 0%;
+	left: auto;
 	right: 0;
-	color: white;
-	font-size: 50%;
-	text-align: center;
-	text-transform: uppercase;
-	font-weight: bold;
-	background: hsl(40,100%,50%);
-	background-image: -webkit-linear-gradient(rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
-	background-image: -moz-linear-gradient(rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
-	background-image: -o-linear-gradient(rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
-	line-height: 1.6;
-	min-width: 20em;
-	
-	-moz-box-shadow: 0 10px 5px -5px rgba(0,0,0,.3);
-	-webkit-box-shadow: 0 10px 5px -5px rgba(0,0,0,.3);
-	box-shadow: 0 10px 5px -5px rgba(0,0,0,.3);
-
-	-moz-transform: rotate(45deg) translate(6em, -2em);
-	-ms-transform: rotate(45deg) translate(6em, -2em);
-	-webkit-transform: rotate(45deg) translate(6em, -2em);
-	-o-transform: rotate(45deg) translate(6em, -2em);
-	transform: rotate(45deg) translate(6em, -2em);
 }
 
 /* Presenter & projector views */
@@ -320,9 +269,6 @@
 	background: rgba(255, 255, 255, .5);
 	color: black;
 	text-shadow: 0 1px white;
-	
-	-moz-box-shadow: .1em .1em .3em rgba(0,0,0,.5) inset;
-	-webkit-box-shadow: .1em .1em .3em rgba(0,0,0,.5) inset;
 	box-shadow: .1em .1em .3em rgba(0,0,0,.5) inset;
 }
 
@@ -337,4 +283,4 @@
 
 .presenter .slide:target > .presenter-notes {
 	display: block;
-}
+}