showoff 0.0.1

data/README.txt

@@ -0,0 +1,93 @@
+ShowOff Presentation Software
+=============================
+
+ShowOff is a Sinatra web app that reads simple configuration files for a
+presentation.  It is sort of like a Keynote web app engine.  I am using it
+to do all my talks in 2010, because I have a deep hatred in my heart for
+Keynote and yet it is by far the best in the field.
+
+The idea is that you setup your slide files in section subdirectories and
+then startup the showoff server in that directory.  It will read in your
+showoff.json file for which sections go in which order and then will give 
+you a URL to present from.
+
+It can:
+
+ * show simple text
+ * show images
+ * show syntax highlighted code
+ * bullets with incremental advancing
+ * re-enact command line interactions
+ * call up a menu of sections/slides at any time to jump around
+
+It might will can:
+
+ * do simple transitions (instant, fade, slide in)
+ * show a timer - elapsed / remaining
+ * perform simple animations of images moving between keyframes
+ * show syncronized, hidden notes on another browser (like an iphone)
+ * show audience questions / comments (twitter or direct)
+ * let audience members go back / catch up as you talk
+ * let audience members vote on sections (?)
+ * broadcast itself on Bonjour 
+ * let audience members download slides, code samples or other supplementary material
+
+Some of the nice things are that you can easily version control it, you 
+can easily move sections between presentations, and you can rearrange or 
+remove sections easily. 
+
+Usage
+====================
+
+To try ShowOff, clone this repo and run ./bin/showoff, which will start
+up the Sinatra server and serve the examples/ directory. Eventually this
+will be gemified and you can run it in any ShowOff directory.
+
+Real World Usage
+====================
+
+So far, showoff has been used in the following presentations:
+
+* LinuxConf.au 2010 - Wrangling Git - Scott Chacon 
+  http://github.com/schacon/showoff-wrangling-git
+
+If you use it for something, please let me know.
+
+Future Plans
+====================
+
+Right now it comes with an example presentation (my LinuxConf.au talk)
+that will probably change or go away at some point.  I would like this
+to eventually be a general tool rather than having the presentation in
+the showoff repo.  Eventually.  So you would install showoff as a gem
+and then have just the presentation as your git repo (or whatever) and
+run 'showoff' in the repo to start the presentation.
+
+I really want this to evolve into a dynamic presentation software server,
+that gives the audience a lot of interaction into the presentation - 
+helping them decide dynamically what the content of the presentation is,
+ask questions without interupting the presenter, etc.  I want the audience
+to be able to download a dynamically generated PDF of either the actual
+talk that was given, or all the available slides, plus supplementary 
+material. And I want the presenter (me) to be able to push each 
+presentation to Heroku or GitHub pages for archiving super easily.
+
+Why Not S5 or Slidy or Slidedown?
+=================================
+
+S5 and Slidy are really cool, and I was going to use them, but mainly I wanted
+something more dynamic.  I wanted Slidy + Slidedown, where I could write my
+slideshows in a structured format in sections, where the sections could easily
+be moved around and between presentations and could be written in Markdown. I
+also like the idea of having interactive presentation system and didn't need
+half the features of S5/Slidy (style based print view, auto-scaling, themes,
+etc).
+
+Requirements
+============
+
+* Ruby (duh)
+* Sinatra (and thus Rack)
+* BlueCloth
+* Nokogiri
+* Firefox or Chrome to present

data/Rakefile

@@ -0,0 +1,15 @@
+begin
+  require 'mg'
+rescue LoadError
+  abort "Please `gem install mg`"
+end
+
+class MG
+  # Monkey patch until http://github.com/defunkt/mg/commit/no_safe_level
+  # is merged and released upstream.
+  def spec
+    @spec ||= eval(File.read(gemspec))
+  end
+end
+
+MG.new("showoff.gemspec")

data/bin/showoff

@@ -0,0 +1,5 @@
+#! /usr/bin/env ruby
+
+$LOAD_PATH.unshift File.join(File.dirname(__FILE__), '..', 'lib')
+require 'showoff'
+ShowOff.run! :host => 'localhost', :port => 9090

data/lib/showoff.rb

@@ -0,0 +1,141 @@
+require 'rubygems'
+require 'sinatra/base'
+require 'json'
+require 'nokogiri'
+
+begin 
+  require 'rdiscount'
+rescue LoadError
+  require 'bluecloth'
+  Markdown = BlueCloth
+end
+require 'pp'
+
+class ShowOff < Sinatra::Application
+
+  set :views, File.dirname(__FILE__) + '/../views'
+  set :public, File.dirname(__FILE__) + '/../public'
+  set :pres_dir, 'example'
+
+  def initialize(app=nil)
+    super(app)
+    puts dir = File.expand_path(File.join(File.dirname(__FILE__), '..'))
+    if Dir.pwd == dir
+      options.pres_dir = dir + '/example'
+    else
+      options.pres_dir = Dir.pwd
+    end
+    puts options.pres_dir
+  end
+
+  helpers do
+    def load_section_files(section)
+      section = File.join(options.pres_dir, section)
+      files = Dir.glob("#{section}/**/*").sort
+      pp files
+      files
+    end
+
+    def process_markdown(name, content)
+      slides = content.split('!SLIDE')
+      slides.delete('')
+      final = ''
+      if slides.size > 1
+        seq = 1
+      end
+      slides.each do |slide|
+        md = ''
+        lines = slide.split("\n")
+        classes = lines.shift
+        slide = lines.join("\n")
+        if seq
+          md += "<div class=\"slide #{classes}\" ref=\"#{name}/#{seq.to_s}\">\n"
+          seq += 1
+        else
+          md += "<div class=\"slide #{classes}\" ref=\"#{name}\">\n"
+        end
+        sl = Markdown.new(slide).to_html 
+        sl = update_image_paths(name, sl)
+        md += sl
+        md += "</div>\n"
+        final += update_commandline_code(md)
+      end
+      final
+    end
+
+    def update_image_paths(path, slide)
+      paths = path.split('/')
+      paths.pop
+      path = paths.join('/')
+      slide.gsub(/img src=\"(.*?)\"/, 'img src="/image/' + path + '/\1"') 
+    end
+    
+    def update_commandline_code(slide)
+      html = Nokogiri::XML.parse(slide)
+      
+      html.css('pre').each do |pre|
+        pre.css('code').each do |code|
+          out = code.text
+          lines = out.split("\n")
+          if lines.first[0, 3] == '@@@'
+            lang = lines.shift.gsub('@@@', '').strip
+            pre.set_attribute('class', 'sh_' + lang)
+            code.content = lines.join("\n")
+          end
+        end
+      end
+
+      html.css('.commandline > pre > code').each do |code|
+        out = code.text
+        lines = out.split(/^\$(.*?)$/)
+        lines.delete('')
+        code.content = ''
+        while(lines.size > 0) do
+          command = lines.shift
+          result = lines.shift
+          c = Nokogiri::XML::Node.new('code', html)
+          c.set_attribute('class', 'command')
+          c.content = '$' + command
+          code << c
+          c = Nokogiri::XML::Node.new('code', html)
+          c.set_attribute('class', 'result')
+          c.content = result
+          code << c
+        end
+      end
+      html.root.to_s
+    end
+  end
+
+  get '/' do
+    erb :index
+  end
+
+  get '/image/*' do
+    img_file = params[:splat].join('/')
+    img = File.join(options.pres_dir, img_file)
+    send_file img
+  end
+
+  get '/slides' do
+    index = File.join(options.pres_dir, 'showoff.json')
+    files = []
+    if File.exists?(index)
+      order = JSON.parse(File.read(index))
+      order = order.map { |s| s['section'] }
+      order.each do |section|
+        files << load_section_files(section)
+
+      end
+      files = files.flatten
+      files = files.select { |f| f =~ /.md/ }
+      data = ''
+      files.each do |f|
+        fname = f.gsub(options.pres_dir + '/', '').gsub('.md', '')
+        data += process_markdown(fname, File.read(f))
+      end
+    end
+    data
+  end
+
+end

data/public/css/fg.menu.css

@@ -0,0 +1,114 @@
+/* Styles for jQuery menu widget
+Author:	Maggie Wachs, maggie@filamentgroup.com
+Date:		September 2008
+*/
+
+
+/* REQUIRED STYLES - the menus will only render correctly with these rules */	
+
+.fg-menu-container { position: absolute; top:0; left:-999px; padding: .4em;  overflow: hidden; }
+.fg-menu-container.fg-menu-flyout { overflow: visible; }
+
+.fg-menu, .fg-menu ul { list-style-type:none; padding: 0; margin:0; }
+
+.fg-menu { position:relative; }
+.fg-menu-flyout .fg-menu { position:static; }
+
+.fg-menu ul { position:absolute; top:0; }
+.fg-menu ul ul { top:-1px; }
+
+.fg-menu-container.fg-menu-ipod .fg-menu-content, 
+.fg-menu-container.fg-menu-ipod .fg-menu-content ul { background: none !important; }
+
+.fg-menu.fg-menu-scroll,
+.fg-menu ul.fg-menu-scroll { overflow: scroll;  overflow-x: hidden; }
+
+.fg-menu li { clear:both; float:left; width:100%; margin: 0; padding:0; border: 0; }	
+.fg-menu li li { font-size:1em; } /* inner li font size must be reset so that they don't blow up */
+
+.fg-menu-flyout ul ul { padding: .4em; }
+.fg-menu-flyout li { position:relative; }
+
+.fg-menu-scroll { overflow: scroll; overflow-x: hidden; }
+
+.fg-menu-breadcrumb { margin: 0; padding: 0; }
+
+.fg-menu-footer {  margin-top: .4em; padding: .4em; }
+.fg-menu-header {  margin-bottom: .4em; padding: .4em; }
+
+.fg-menu-breadcrumb li { float: left; list-style: none; margin: 0; padding: 0 .2em; font-size: .9em; opacity: .7; }
+.fg-menu-breadcrumb li.fg-menu-prev-list,
+.fg-menu-breadcrumb li.fg-menu-current-crumb { clear: left; float: none; opacity: 1; }
+.fg-menu-breadcrumb li.fg-menu-current-crumb { padding-top: .2em; }
+
+.fg-menu-breadcrumb a, 
+.fg-menu-breadcrumb span { float: left; }
+
+.fg-menu-footer a:link,
+.fg-menu-footer a:visited { float:left; width:100%; text-decoration: none; }
+.fg-menu-footer a:hover,
+.fg-menu-footer a:active {  }
+
+.fg-menu-footer a span { float:left; cursor: pointer; }
+
+.fg-menu-breadcrumb .fg-menu-prev-list a:link,
+.fg-menu-breadcrumb .fg-menu-prev-list a:visited,
+.fg-menu-breadcrumb .fg-menu-prev-list a:hover,
+.fg-menu-breadcrumb .fg-menu-prev-list a:active { background-image: none; text-decoration:none; }
+	
+.fg-menu-breadcrumb .fg-menu-prev-list a { float: left; padding-right: .4em; }
+.fg-menu-breadcrumb .fg-menu-prev-list a .ui-icon { float: left; }
+	
+.fg-menu-breadcrumb .fg-menu-current-crumb a:link,
+.fg-menu-breadcrumb .fg-menu-current-crumb a:visited,
+.fg-menu-breadcrumb .fg-menu-current-crumb a:hover,
+.fg-menu-breadcrumb .fg-menu-current-crumb a:active { display:block; background-image:none; font-size:1.3em; text-decoration:none; }
+
+
+
+/* REQUIRED LINK STYLES: links are "display:block" by default; if the menu options are split into 
+	selectable node links and 'next' links, the script floats the node links left and floats the 'next' links to the right	*/
+
+.fg-menu a:link,
+.fg-menu a:visited,
+.fg-menu a:hover,
+.fg-menu a:active { float:left; width:92%; padding:.3em 3%; text-decoration:none; outline: 0 !important; }
+
+.fg-menu a { border: 1px dashed transparent; }
+
+.fg-menu a.ui-state-default:link,
+.fg-menu a.ui-state-default:visited,
+.fg-menu a.ui-state-default:hover,
+.fg-menu a.ui-state-default:active,
+.fg-menu a.ui-state-hover:link,
+.fg-menu a.ui-state-hover:visited,
+.fg-menu a.ui-state-hover:hover,
+.fg-menu a.ui-state-hover:active,
+ .fg-menu a.ui-state-active:link,
+ .fg-menu a.ui-state-active:visited,
+ .fg-menu a.ui-state-active:hover,
+.fg-menu a.ui-state-active:active { border-style: solid; font-weight: normal; }
+
+.fg-menu a span { display:block; cursor:pointer; }
+
+
+ /* SUGGESTED STYLES - for use with jQuery UI Themeroller CSS */	
+ 
+.fg-menu-indicator span { float:left; }
+.fg-menu-indicator span.ui-icon { float:right; }
+
+.fg-menu-content.ui-widget-content, 
+.fg-menu-content ul.ui-widget-content { border:0; }
+
+
+/* ICONS AND DIVIDERS */
+
+.fg-menu.fg-menu-has-icons a:link,
+.fg-menu.fg-menu-has-icons a:visited,
+.fg-menu.fg-menu-has-icons a:hover,
+.fg-menu.fg-menu-has-icons a:active { padding-left:20px; }
+
+.fg-menu .horizontal-divider hr, .fg-menu .horizontal-divider span { padding:0; margin:5px .6em; }
+.fg-menu .horizontal-divider hr { border:0; height:1px; }
+.fg-menu .horizontal-divider span { font-size:.9em; text-transform: uppercase; padding-left:.2em; }
+

data/public/css/sh_style.css

@@ -0,0 +1,66 @@
+pre.sh_sourceCode {
+  background-color: white;
+  color: black;
+  font-style: normal;
+  font-weight: normal;
+}
+
+pre.sh_sourceCode .sh_keyword { color: blue; font-weight: bold; }           /* language keywords */
+pre.sh_sourceCode .sh_type { color: darkgreen; }                            /* basic types */
+pre.sh_sourceCode .sh_usertype { color: teal; }                             /* user defined types */
+pre.sh_sourceCode .sh_string { color: red; font-family: monospace; }        /* strings and chars */
+pre.sh_sourceCode .sh_regexp { color: orange; font-family: monospace; }     /* regular expressions */
+pre.sh_sourceCode .sh_specialchar { color: pink; font-family: monospace; }  /* e.g., \n, \t, \\ */
+pre.sh_sourceCode .sh_comment { color: brown; font-style: italic; }         /* comments */
+pre.sh_sourceCode .sh_number { color: purple; }                             /* literal numbers */
+pre.sh_sourceCode .sh_preproc { color: darkblue; font-weight: bold; }       /* e.g., #include, import */
+pre.sh_sourceCode .sh_symbol { color: darkred; }                            /* e.g., <, >, + */
+pre.sh_sourceCode .sh_function { color: black; font-weight: bold; }         /* function calls and declarations */
+pre.sh_sourceCode .sh_cbracket { color: red; }                              /* block brackets (e.g., {, }) */
+pre.sh_sourceCode .sh_todo { font-weight: bold; background-color: cyan; }   /* TODO and FIXME */
+
+/* Predefined variables and functions (for instance glsl) */
+pre.sh_sourceCode .sh_predef_var { color: darkblue; }
+pre.sh_sourceCode .sh_predef_func { color: darkblue; font-weight: bold; }
+
+/* for OOP */
+pre.sh_sourceCode .sh_classname { color: teal; }
+
+/* line numbers (not yet implemented) */
+pre.sh_sourceCode .sh_linenum { color: black; font-family: monospace; }
+
+/* Internet related */
+pre.sh_sourceCode .sh_url { color: blue; text-decoration: underline; font-family: monospace; }
+
+/* for ChangeLog and Log files */
+pre.sh_sourceCode .sh_date { color: blue; font-weight: bold; }
+pre.sh_sourceCode .sh_time, pre.sh_sourceCode .sh_file { color: darkblue; font-weight: bold; }
+pre.sh_sourceCode .sh_ip, pre.sh_sourceCode .sh_name { color: darkgreen; }
+
+/* for Prolog, Perl... */
+pre.sh_sourceCode .sh_variable { color: darkgreen; }
+
+/* for LaTeX */
+pre.sh_sourceCode .sh_italics { color: darkgreen; font-style: italic; }
+pre.sh_sourceCode .sh_bold { color: darkgreen; font-weight: bold; }
+pre.sh_sourceCode .sh_underline { color: darkgreen; text-decoration: underline; }
+pre.sh_sourceCode .sh_fixed { color: green; font-family: monospace; }
+pre.sh_sourceCode .sh_argument { color: darkgreen; }
+pre.sh_sourceCode .sh_optionalargument { color: purple; }
+pre.sh_sourceCode .sh_math { color: orange; }
+pre.sh_sourceCode .sh_bibtex { color: blue; }
+
+/* for diffs */
+pre.sh_sourceCode .sh_oldfile { color: orange; }
+pre.sh_sourceCode .sh_newfile { color: darkgreen; }
+pre.sh_sourceCode .sh_difflines { color: blue; }
+
+/* for css */
+pre.sh_sourceCode .sh_selector { color: purple; }
+pre.sh_sourceCode .sh_property { color: blue; }
+pre.sh_sourceCode .sh_value { color: darkgreen; font-style: italic; }
+
+/* other */
+pre.sh_sourceCode .sh_section { color: black; font-weight: bold; }
+pre.sh_sourceCode .sh_paren { color: red; }
+pre.sh_sourceCode .sh_attribute { color: darkgreen; }

data/public/css/showoff.css

@@ -0,0 +1,186 @@
+body { font-family: "Gill Sans", Helvetica, Arial, sans-serif; }
+
+#preso { 
+    margin: 0;
+    padding: 0;
+    width: 1000px;
+    height: 730px;
+    margin-left:auto; 
+    margin-right:auto;
+    overflow:hidden;
+}
+#footer { 
+    background: #eee;
+    margin: 0;
+    padding: 3px;
+    width: 1000px;
+    height: 30px;
+    margin-left:auto; 
+    margin-right:auto;
+}
+
+.slide {
+    border: 1px solid #fff;
+}
+
+.center img {
+    display:block;
+    margin-left:auto;
+    margin-right:auto;
+}
+
+.bullets ul {
+    display: block;
+    height: 600px;
+    font-size: 3em;
+    list-style: none;
+    margin-left: 0;
+    padding-left: 1em;
+    text-indent: -1em;
+}
+.bullets ul li {
+    text-align: center;
+    padding: 25px;
+}
+
+.smbullets ul {
+    display: block;
+    height: 600px;
+    font-size: 2em;
+    list-style: none;
+    margin-left: 0;
+    padding-left: 1em;
+    text-indent: -1em;
+}
+.smbullets ul li {
+    text-align: center;
+    padding: 10px;
+}
+
+.commandline pre {
+    font-size: 2em;
+}
+
+.commandline code.command {
+    color: #000;
+}
+
+.commandline code.result {
+    color: #444;
+}
+
+.command h1 {
+    white-space: pre;
+    font-family: monospace;
+    font-size: 3em;
+}
+
+.code {
+    white-space: pre;
+    font-family: monospace;
+}
+
+.subsection {
+    background: #008;
+    color: #fff;
+}
+
+.small {
+    font-size: 80%;
+}
+
+.smaller {
+    font-size: 70%;
+}
+
+h1 { font-size: 5em; font-weight: normal; text-align: center;}
+h2 { font-size: 3em; font-weight: normal; text-align: center; }
+h3 { font-size: 2em; font-weight: normal; text-align: center; }
+
+pre { margin-left: 40px; font-size: 2.8em; }
+
+.hidden { position:absolute; top:0; left:-9999px; width:1px; height:1px; overflow:hidden; }
+#debugInfo { margin-left: 30px; }
+
+#help {
+    background: #9f9;
+    position: absolute;
+    right: 80px;
+    display: none;
+}
+#help table tr td.key {
+    text-align: right;
+    border-right: 2px solid #8b8;
+    padding-right: 4px;
+    font-weight: bold;
+}
+
+.fg-button { clear:left; margin:0 4px 40px 20px; padding: .4em 1em; text-decoration:none !important; cursor:pointer; position: relative; text-align: center; zoom: 1; }
+.fg-button .ui-icon { position: absolute; top: 50%; margin-top: -8px; left: 50%; margin-left: -8px; }
+a.fg-button { float:left; }
+.fg-button-icon-right { padding-right: 2.1em; }
+.fg-button-icon-right .ui-icon { left: auto; right: .2em; margin-left: 0; }
+
+.fg-button.ui-state-loading .ui-icon { background: url(spinner_bar.gif) no-repeat 0 0; }
+
+#navmenu { position: absolute; top: 10px; left: 10px; width: 50px; }
+
+.code .c { color: #999988; font-style: italic } /* Comment */
+.code .err { color: #a61717; background-color: #e3d2d2 } /* Error */
+.code .k { font-weight: bold } /* Keyword */
+.code .o { font-weight: bold } /* Operator */
+.code .cm { color: #999988; font-style: italic } /* Comment.Multiline */
+.code .cp { color: #999999; font-weight: bold } /* Comment.Preproc */
+.code .c1 { color: #999988; font-style: italic } /* Comment.Single */
+.code .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
+.code .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
+.code .gd .x { color: #000000; background-color: #ffaaaa } /* Generic.Deleted.Specific */
+.code .ge { font-style: italic } /* Generic.Emph */
+.code .gr { color: #aa0000 } /* Generic.Error */
+.code .gh { color: #999999 } /* Generic.Heading */
+.code .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
+.code .gi .x { color: #000000; background-color: #aaffaa } /* Generic.Inserted.Specific */
+.code .go { color: #888888 } /* Generic.Output */
+.code .gp { color: #555555 } /* Generic.Prompt */
+.code .gs { font-weight: bold } /* Generic.Strong */
+.code .gu { color: #aaaaaa } /* Generic.Subheading */
+.code .gt { color: #aa0000 } /* Generic.Traceback */
+.code .kc { font-weight: bold } /* Keyword.Constant */
+.code .kd { font-weight: bold } /* Keyword.Declaration */
+.code .kp { font-weight: bold } /* Keyword.Pseudo */
+.code .kr { font-weight: bold } /* Keyword.Reserved */
+.code .kt { color: #445588; font-weight: bold } /* Keyword.Type */
+.code .m { color: #009999 } /* Literal.Number */
+.code .s { color: #d14 } /* Literal.String */
+.code .na { color: #008080 } /* Name.Attribute */
+.code .nb { color: #0086B3 } /* Name.Builtin */
+.code .nc { color: #445588; font-weight: bold } /* Name.Class */
+.code .no { color: #008080 } /* Name.Constant */
+.code .ni { color: #800080 } /* Name.Entity */
+.code .ne { color: #990000; font-weight: bold } /* Name.Exception */
+.code .nf { color: #990000; font-weight: bold } /* Name.Function */
+.code .nn { color: #555555 } /* Name.Namespace */
+.code .nt { color: #000080 } /* Name.Tag */
+.code .nv { color: #008080 } /* Name.Variable */
+.code .ow { font-weight: bold } /* Operator.Word */
+.code .w { color: #bbbbbb } /* Text.Whitespace */
+.code .mf { color: #009999 } /* Literal.Number.Float */
+.code .mh { color: #009999 } /* Literal.Number.Hex */
+.code .mi { color: #009999 } /* Literal.Number.Integer */
+.code .mo { color: #009999 } /* Literal.Number.Oct */
+.code .sb { color: #d14 } /* Literal.String.Backtick */
+.code .sc { color: #d14 } /* Literal.String.Char */
+.code .sd { color: #d14 } /* Literal.String.Doc */
+.code .s2 { color: #d14 } /* Literal.String.Double */
+.code .se { color: #d14 } /* Literal.String.Escape */
+.code .sh { color: #d14 } /* Literal.String.Heredoc */
+.code .si { color: #d14 } /* Literal.String.Interpol */
+.code .sx { color: #d14 } /* Literal.String.Other */
+.code .sr { color: #009926 } /* Literal.String.Regex */
+.code .s1 { color: #d14 } /* Literal.String.Single */
+.code .ss { color: #990073 } /* Literal.String.Symbol */
+.code .bp { color: #999999 } /* Name.Builtin.Pseudo */
+.code .vc { color: #008080 } /* Name.Variable.Class */
+.code .vg { color: #008080 } /* Name.Variable.Global */
+.code .vi { color: #008080 } /* Name.Variable.Instance */
+.code .il { color: #009999 } /* Literal.Number.Integer.Long */