keydown 0.5.0

data/spec/tasks/slides_spec.rb

@@ -0,0 +1,171 @@
+require File.expand_path(File.dirname(__FILE__) + '/../spec_helper')
+
+describe Keydown, "`slides`" do
+
+  shared_examples_for "generating a presentation file" do
+
+    it "should have the correct file name" do
+      @file.should_not be_nil
+    end
+
+    it "should set the document's title" do
+      @doc.css('title').text.should == "Kermit the Frog Says..."
+    end
+
+    it "should generate the correct number of slides" do
+      @doc.css('div.slide').length.should == 4
+    end
+
+    it "should include the HTML5 Rocks CSS only once" do
+      @doc.css('link[@href="css/rocks.css"]').length.should == 1
+    end
+
+    it "should include the HTML5 Rocks JavaScript only once" do
+      @doc.css('script[@src="js/rocks.js"]').length.should == 1
+    end
+
+  end
+
+  before :each do
+    @tmp_dir = "#{Dir.tmpdir}/keydown_test"
+    FileUtils.rm_r @tmp_dir if File.exists?(@tmp_dir)
+    FileUtils.mkdir_p @tmp_dir
+
+    @thor = Thor.new
+  end
+
+  describe "when file cannot be found" do
+    before(:each) do
+      Dir.chdir @tmp_dir do
+        @std_out = capture_output do
+          @thor.invoke Keydown::Tasks, "slides", "with_title.md"
+        end
+      end
+    end
+
+    it "should warn the user" do
+      @std_out.should match(/not found\. Please call with a KeyDown Markdown file: keydown slides my_file\.md/)
+    end
+
+    it "should not write out a file" do
+      Dir.glob("#{@tmp_dir}/*.html").should be_empty
+    end
+
+  end
+
+  describe "with defaults" do
+
+    before :each do
+      system "cp -r spec/fixtures/with_title.md #{@tmp_dir}"
+    end
+
+    describe "should generate an html file that" do
+      before(:each) do
+        capture_output do
+          Dir.chdir @tmp_dir do
+            @thor.invoke Keydown::Tasks, "slides", "with_title.md"
+            @file = File.new('with_title.html')
+            @doc = Nokogiri(@file)
+          end
+        end
+      end
+
+      it_should_behave_like "generating a presentation file"
+
+      describe "should have one slide that" do
+        before :each do
+          @slide = @doc.css('section')[3]
+        end
+
+        it "should have the correct css class(es)" do
+          @slide['class'].should match /foo/
+          @slide['class'].should match /bar/
+        end
+
+        it "should have the correct content" do
+          @slide.css('h1').text.should match /The Letter Q/
+        end
+      end
+    end
+
+    describe "should add an .md extention if one isn't specified" do
+      before(:each) do
+        capture_output do
+          Dir.chdir @tmp_dir do
+            @thor.invoke Keydown::Tasks, "slides", "with_title"
+            @file = File.new('with_title.html')
+            @doc = Nokogiri(@file)
+          end
+        end
+      end
+
+      it_should_behave_like "generating a presentation file"
+
+    end
+  end
+
+  describe "with directory tree with custom CSS & JS" do
+    before(:each) do
+      capture_output do
+
+      Dir.chdir @tmp_dir do
+        @thor.invoke Keydown::Tasks, "generate", "test"
+
+        Dir.chdir "test" do
+          system "cp #{Keydown::Tasks.source_root}/spec/fixtures/with_title.md #{@tmp_dir}/test/with_title.md"
+          system "cp #{Keydown::Tasks.source_root}/spec/fixtures/custom.css #{@tmp_dir}/test/css/custom.css"
+          system "cp #{Keydown::Tasks.source_root}/spec/fixtures/custom.js #{@tmp_dir}/test/js/custom.js"
+
+          @thor.invoke Keydown::Tasks, "slides", "with_title.md"
+
+          @file = File.new('with_title.html')
+          @doc = Nokogiri(@file)
+        end
+      end
+      end
+    end
+
+    it_should_behave_like "generating a presentation file"
+
+    it "should include any custom CSS file from the css directory" do
+      @doc.css('link[@href="css/test.css"]').length.should == 1
+      @doc.css('link[@href="css/custom.css"]').length.should == 1
+    end
+
+    it "should include any custom JavaScript files from the js directory" do
+      @doc.css('script[@src="js/test.js"]').length.should == 1
+      @doc.css('script[@src="js/custom.js"]').length.should == 1
+    end
+  end
+
+  describe "for a presentation that has background images" do
+    before(:each) do
+      capture_output do
+
+        Dir.chdir @tmp_dir do
+          @thor.invoke Keydown::Tasks, "generate", "test"
+
+          Dir.chdir "test" do
+            system "cp #{Keydown::Tasks.source_root}/spec/fixtures/with_backgrounds.md #{@tmp_dir}/test/with_backgrounds.md"
+
+            @thor.invoke Keydown::Tasks, "slides", "with_backgrounds.md"
+
+            @file = File.new('with_backgrounds.html')
+            @doc = Nokogiri(@file)
+          end
+        end
+      end
+    end
+
+    it_should_behave_like "generating a presentation file"
+
+    it "should add the keydown.css file (which has the backgrounds) to the css directory" do
+      File.exist?("#{@tmp_dir}/test/css/keydown.css").should be_true
+    end
+
+    it "should add the keydown.css file to the HTML file" do
+      @doc.css('link[@href="css/keydown.css"]').length.should == 1
+    end
+
+  end
+end

data/templates/generate/%presentation_name%.md.tt

@@ -0,0 +1,27 @@
+# <%= presentation_name %>
+
+!SLIDE
+
+# A Title Slide
+
+## me@example.com
+
+!SLIDE
+
+# Some sample code
+
+``` ruby
+def method
+  puts "Hello, World"
+end
+```
+
+!NOTES
+
+ * a note
+
+!SLIDE
+
+# With a Background Image
+
+}}} images/test.png

data/templates/generate/css/%presentation_name%.css

@@ -0,0 +1 @@
+/* Custom CSS for your KeyDown presentation here */

data/templates/generate/css/rocks.css

@@ -0,0 +1,392 @@
+body {
+  font: 20px "Lucida Grande", "Trebuchet MS", Verdana, sans-serif;
+  padding: 0;
+  margin: 0;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 0px; top: 0px;
+}
+
+.presentation {
+  position: absolute;
+  height: 100%;
+  width: 100%;
+  left: 0px;
+  top: 0px;
+  display: block;
+  overflow: hidden;
+  background: #778;
+}
+
+.slides {
+  width: 100%;
+  height: 100%;
+  left: 0;
+  top: 0;
+  position: absolute;
+  display: block;
+  -webkit-transition: -webkit-transform 1s ease-in-out;
+  -moz-transition: -moz-transform 1s ease-in-out;
+  -o-transition: -o-transform 1s ease-in-out;
+  transition: transform 1s ease-in-out;
+
+  /* so it's visible in the iframe. */
+  -webkit-transform: scale(0.8);
+  -moz-transform: scale(0.8);
+  -o-transform: scale(0.8);
+  transform: scale(0.8);
+
+}
+
+.slide {
+  display: none;
+  position: absolute;
+  overflow: hidden;
+  width: 900px;
+  height: 700px;
+  left: 50%;
+  top: 50%;
+  margin-top: -350px;
+  background-color: #eee;
+  background: -webkit-gradient(linear, left bottom, left top, from(#bbd), to(#fff));
+  background: -moz-linear-gradient(bottom, #bbd, #fff);
+  background: linear-gradient(bottom, #bbd, #fff);
+  -webkit-transition: all 0.25s ease-in-out;
+  -moz-transition: all 0.25s ease-in-out;
+  -o-transition: all 0.25s ease-in-out;
+  transition: all 0.25s ease-in-out;
+  -webkit-transform: scale(1);
+  -moz-transform: scale(1);
+  -o-transform: scale(1);
+  transform: scale(1);
+}
+
+.slide:nth-child(even) {
+  -moz-border-radius: 20px 0;
+  -khtml-border-radius: 20px 0;
+  border-radius: 20px 0; /* includes Opera 10.5+ */
+  -webkit-border-top-left-radius: 20px;
+  -webkit-border-bottom-right-radius: 20px;
+}
+
+.slide:nth-child(odd) {
+  -moz-border-radius: 0 20px;
+  -khtml-border-radius: 0 20px;
+  border-radius: 0 20px;
+  -webkit-border-top-right-radius: 20px;
+  -webkit-border-bottom-left-radius: 20px;
+}
+
+.slide p, .slide textarea {
+  font-size: 120%;
+}
+
+.slide .counter {
+  color: #999999;
+  position: absolute;
+  left: 20px;
+  bottom: 20px;
+  display: block;
+  font-size: 70%;
+}
+
+.slide.title > .counter,
+.slide.segue > .counter,
+.slide.mainTitle > .counter {
+  display: none;
+}
+
+.force-render {
+  display: block;
+  visibility: hidden;
+}
+
+.slide.far-past {
+  display: block;
+  margin-left: -2400px;
+}
+
+.slide.past {
+  visibility: visible;
+  display: block;
+  margin-left: -1400px;
+}
+
+.slide.current {
+  visibility: visible;
+  display: block;
+  margin-left: -450px;
+}
+
+.slide.future {
+  visibility: visible;
+  display: block;
+  margin-left: 500px;
+}
+
+.slide.far-future {
+  display: block;
+  margin-left: 1500px;
+}
+
+body.three-d div.slides {
+  -webkit-transform: translateX(50px) scale(0.8) rotateY(10deg);
+  -moz-transform: translateX(50px) scale(0.8) rotateY(10deg);
+  -o-transform: translateX(50px) scale(0.8) rotateY(10deg);
+  transform: translateX(50px) scale(0.8) rotateY(10deg);
+}
+
+/* Content */
+
+@font-face { font-family: 'Junction'; src: url(src/Junction02.otf); }
+@font-face { font-family: 'LeagueGothic'; src: url(src/LeagueGothic.otf); }
+
+header {
+  font-family: 'Droid Sans';
+  font-weight: normal;
+  letter-spacing: -.05em;
+  text-shadow: rgba(0, 0, 0, 0.2) 0 2px 5px;
+  left: 30px;
+  top: 25px;
+  margin: 0;
+  padding: 0;
+  font-size: 140%;
+}
+
+h1 {
+  font-size: 140%;
+  display: inline;
+  font-weight: normal;
+  padding: 0;
+  margin: 0;
+}
+
+h2 {
+  font-family: 'Droid Sans';
+  color: black;
+  font-size: 120%;
+  padding: 0;
+  margin: 20px 0;
+}
+
+h2:first-child {
+  margin-top: 0;
+}
+
+section, footer {
+  font-family: 'Droid Sans';
+  color: #3f3f3f;
+  text-shadow: rgba(0, 0, 0, 0.2) 0 2px 5px;
+  margin: 100px 30px 0;
+  display: block;
+  overflow: hidden;
+}
+
+footer {
+  font-size: 100%;
+  margin: 20px 0 0 30px;
+}
+
+a {
+  color: inherit;
+  display: inline-block;
+  text-decoration: none;
+  line-height: 110%;
+  border-bottom: 2px solid #3f3f3f;
+}
+
+ul {
+  margin: 0;
+  padding: 0;
+}
+
+button {
+  font-size: 100%;
+}
+
+pre button {
+  margin: 2px;
+}
+
+section.left {
+  float: left;
+  width: 390px;
+}
+
+section.small {
+  font-size: 24px;
+}
+
+section.small ul {
+  margin: 0 0 0 15px;
+  padding: 0;
+}
+
+section.small li {
+  padding-bottom: 0;
+}
+
+section.middle {
+  line-height: 2em;
+  text-align: center;
+  display: table-cell;
+  vertical-align: middle;
+  height: 700px;
+  width: 900px;
+}
+
+pre {
+  text-align: left;
+  font-family: 'Droid Sans Mono', Courier;
+  font-size: 80%;
+  padding: 10px 20px;
+  background: rgba(255, 0, 0, 0.05);
+  -webkit-border-radius: 8px;
+  -khtml-border-radius: 8px;
+  -moz-border-radius: 8px;
+  border-radius: 8px;
+  border: 1px solid rgba(255, 0, 0, 0.2);
+}
+
+pre select {
+  font-family: Monaco, Courier;
+  border: 1px solid #c61800;
+}
+
+input {
+  font-size: 100%;
+  margin-right: 10px;
+  font-family: Helvetica;
+  padding: 3px;
+}
+input[type="range"] {
+  width: 100%;
+}
+
+button {
+  margin: 20px 10px 0 0;
+  font-family: Verdana;
+}
+
+button.large {
+  font-size: 32px;
+}
+
+pre b {
+  font-weight: normal;
+  color: #c61800;
+  text-shadow: #c61800 0 0 1px;
+  /*letter-spacing: -1px;*/
+}
+pre em {
+  font-weight: normal;
+  font-style: normal;
+  color: #18a600;
+  text-shadow: #18a600 0 0 1px;
+}
+pre input[type="range"] {
+  height: 6px;
+  cursor: pointer;
+  width: auto;
+}
+
+div.example {
+  display: block;
+  padding: 10px 20px;
+  color: black;
+  background: rgba(255, 255, 255, 0.4);
+  -webkit-border-radius: 8px;
+  -khtml-border-radius: 8px;
+  -moz-border-radius: 8px;
+  border-radius: 8px;
+  margin-bottom: 10px;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+}
+
+video {
+  -moz-border-radius: 8px;
+  -khtml-border-radius: 8px;
+  -webkit-border-radius: 8px;
+  border-radius: 8px;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+}
+
+.key {
+  font-family: 'Droid Sans';
+  color: black;
+  display: inline-block;
+  padding: 6px 10px 3px 10px;
+  font-size: 100%;
+  line-height: 30px;
+  text-shadow: none;
+  letter-spacing: 0;
+  bottom: 10px;
+  position: relative;
+  -moz-border-radius: 10px;
+  -khtml-border-radius: 10px;
+  -webkit-border-radius: 10px;
+  border-radius: 10px;
+  background: white;
+  box-shadow: rgba(0, 0, 0, 0.1) 0 2px 5px;
+  -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0 2px 5px;
+  -moz-box-shadow: rgba(0, 0, 0, 0.1) 0 2px 5px;
+  -o-box-shadow: rgba(0, 0, 0, 0.1) 0 2px 5px;
+}
+
+.key { font-family: Arial; }
+
+:not(header) > .key {
+  margin: 0 5px;
+  bottom: 4px;
+}
+
+.two-column {
+  -webkit-column-count: 2;
+  -moz-column-count: 2;
+  column-count: 2;
+}
+
+.stroke {
+  -webkit-text-stroke-color: red;
+  -webkit-text-stroke-width: 1px;
+} /* currently webkit-only */
+
+.center {
+  text-align: center;
+}
+
+#presentation-counter {
+  color: #ccc;
+  font-size: 70%;
+  letter-spacing: 1px;
+  position: absolute;
+  top: 40%;
+  left: 0;
+  width: 100%;
+  text-align: center;
+}
+
+div:not(.current).reduced {
+  -webkit-transform: scale(0.8);
+  -moz-transform: scale(0.8);
+  -o-transform: scale(0.8);
+  transform: scale(0.8);
+}
+
+.no-transitions {
+  -webkit-transition: none;
+  -moz-transition: none;
+  -o-transition: none;
+  transition: none;
+}
+
+.no-gradients {
+  background: none;
+  background-color: #fff;
+}
+
+ul.bulleted {
+  padding-left: 30px;
+}
+

data/templates/generate/js/%presentation_name%.js

@@ -0,0 +1 @@
+// Add your custom JavaScript for your KeyDown presentation here