reveal-ck 0.1.6 → 0.1.7
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +8 -8
- data/bin/reveal-ck +18 -12
- data/lib/reveal-ck.rb +3 -10
- data/lib/reveal-ck/builders.rb +4 -0
- data/lib/reveal-ck/builders/build_task.rb +21 -0
- data/lib/reveal-ck/builders/builder.rb +27 -0
- data/lib/reveal-ck/builders/index_html.rb +85 -0
- data/lib/reveal-ck/builders/packaged_slides.rb +84 -0
- data/lib/reveal-ck/changers.rb +3 -0
- data/lib/reveal-ck/changers/slicer.rb +25 -0
- data/lib/reveal-ck/changers/splicer.rb +37 -0
- data/lib/reveal-ck/changers/string_replacer.rb +18 -0
- data/lib/reveal-ck/config.rb +51 -23
- data/lib/reveal-ck/presentation.rb +24 -15
- data/lib/reveal-ck/presentation_dsl.rb +20 -12
- data/lib/reveal-ck/slide.rb +3 -3
- data/lib/reveal-ck/templates.rb +3 -0
- data/lib/reveal-ck/templates/finder.rb +35 -0
- data/lib/reveal-ck/templates/processor.rb +32 -0
- data/lib/reveal-ck/templates/render_scope.rb +14 -0
- data/lib/reveal-ck/version.rb +1 -1
- data/rakelib/examples.rake +7 -0
- data/spec/data/{slicer → changers/slicer}/after_remove +0 -0
- data/spec/data/{slicer → changers/slicer}/before_remove +0 -0
- data/spec/data/{splicer → changers/splicer}/abcd +0 -0
- data/spec/data/{splicer → changers/splicer}/after_insert +0 -0
- data/spec/data/{splicer → changers/splicer}/before_insert +0 -0
- data/spec/data/{string_replacer → changers/string_replacer}/after_replace +0 -0
- data/spec/data/{string_replacer → changers/string_replacer}/before_replace +0 -0
- data/spec/data/config/full_config.toml +7 -0
- data/spec/data/config/partial_config.toml +1 -0
- data/spec/data/presentation/slides.haml +2 -0
- data/spec/data/presentation/slides.rb +5 -0
- data/spec/data/{dsl/slides.rb → presentation_dsl/dsl.rb} +4 -0
- data/spec/data/templates/finder/code/function.rb +3 -0
- data/spec/data/{template_finder/automated/automated.slim → templates/finder/quotes/create} +0 -0
- data/spec/data/{template_finder/automated/common.haml → templates/finder/templates/template_one.slim} +0 -0
- data/spec/data/{template_finder/custom/common.haml → templates/finder/templates/template_two.slim} +0 -0
- data/spec/data/{template_finder/custom/custom.slim → templates/finder/templates/text.slim} +0 -0
- data/spec/data/{haml → templates/processor}/basic.haml +0 -0
- data/spec/data/{slim → templates/processor}/basic.slim +0 -0
- data/spec/data/templates/render_scope/quote +2 -0
- data/spec/examples/programmatic_slides_spec.rb +12 -0
- data/spec/examples/slide_output_spec.rb +12 -0
- data/spec/lib/reveal-ck/builders/builder_spec.rb +39 -0
- data/spec/lib/reveal-ck/builders/packaged_slides_spec.rb +39 -0
- data/spec/lib/reveal-ck/changers/slicer_spec.rb +46 -0
- data/spec/lib/reveal-ck/changers/splicer_spec.rb +45 -0
- data/spec/lib/reveal-ck/changers/string_replacer_spec.rb +35 -0
- data/spec/lib/reveal-ck/config_spec.rb +68 -20
- data/spec/lib/reveal-ck/presentation_dsl_spec.rb +21 -11
- data/spec/lib/reveal-ck/presentation_spec.rb +40 -38
- data/spec/lib/reveal-ck/slide_spec.rb +3 -3
- data/spec/lib/reveal-ck/templates/finder_spec.rb +88 -0
- data/spec/lib/reveal-ck/templates/processor_spec.rb +31 -0
- data/spec/lib/reveal-ck/templates/render_scope_spec.rb +24 -0
- data/templates/{title.slim → intro.slim} +0 -0
- metadata +77 -71
- data/lib/reveal-ck/build_task.rb +0 -19
- data/lib/reveal-ck/builder.rb +0 -25
- data/lib/reveal-ck/file_slicer.rb +0 -23
- data/lib/reveal-ck/file_splicer.rb +0 -36
- data/lib/reveal-ck/file_string_replacer.rb +0 -16
- data/lib/reveal-ck/presentation_builder.rb +0 -94
- data/lib/reveal-ck/slide_builder.rb +0 -81
- data/lib/reveal-ck/slides_html_builder.rb +0 -39
- data/lib/reveal-ck/template_finder.rb +0 -33
- data/lib/reveal-ck/template_processor.rb +0 -28
- data/spec/data/config/config.toml +0 -6
- data/spec/data/html/converted_basic_haml.html +0 -10
- data/spec/data/html/converted_basic_slim.html +0 -10
- data/spec/data/html/reveal-js-index.html +0 -375
- data/spec/data/slides_html_builder/slides.haml +0 -3
- data/spec/data/slides_html_builder/slides.rb +0 -14
- data/spec/data/slides_html_builder/slides.slim +0 -2
- data/spec/lib/reveal-ck/builder_spec.rb +0 -37
- data/spec/lib/reveal-ck/file_slicer_spec.rb +0 -44
- data/spec/lib/reveal-ck/file_splicer_spec.rb +0 -43
- data/spec/lib/reveal-ck/file_string_replacer_spec.rb +0 -34
- data/spec/lib/reveal-ck/presentation_builder_spec.rb +0 -37
- data/spec/lib/reveal-ck/slides_html_builder_spec.rb +0 -102
- data/spec/lib/reveal-ck/template_finder_spec.rb +0 -87
- data/spec/lib/reveal-ck/template_processor_spec.rb +0 -29
@@ -1,81 +0,0 @@
|
|
1
|
-
module RevealCK
|
2
|
-
#
|
3
|
-
# Public: A SlideBuilder knows how to build the index.html file (the
|
4
|
-
# core slides) within a reveal.js presentation.
|
5
|
-
#
|
6
|
-
class SlideBuilder < Builder
|
7
|
-
|
8
|
-
attr_reader :user_slides, :reveal_slides
|
9
|
-
|
10
|
-
attr_reader :tasks
|
11
|
-
|
12
|
-
attr_reader :config
|
13
|
-
|
14
|
-
def initialize(args)
|
15
|
-
@user_slides = args[:user_slides]
|
16
|
-
@reveal_slides = args[:reveal_slides]
|
17
|
-
@config = args[:config]
|
18
|
-
end
|
19
|
-
|
20
|
-
private
|
21
|
-
|
22
|
-
def register_tasks
|
23
|
-
|
24
|
-
@tasks = []
|
25
|
-
|
26
|
-
remove_default_content reveal_slides
|
27
|
-
add_user_content reveal_slides, user_slides
|
28
|
-
replace_title reveal_slides, config.title
|
29
|
-
replace_author reveal_slides, config.author
|
30
|
-
replace_theme reveal_slides, config.theme
|
31
|
-
end
|
32
|
-
|
33
|
-
def remove_default_content(file)
|
34
|
-
add_task 'Slicing out reveal.js default slides' do
|
35
|
-
begin_line_num = 38 # Line where I see <div class="slides">
|
36
|
-
end_line_num = 346 # Closing <div>
|
37
|
-
default_slides = begin_line_num..end_line_num
|
38
|
-
FileSlicer.remove! file, default_slides
|
39
|
-
end
|
40
|
-
end
|
41
|
-
|
42
|
-
def add_user_content(file, user_slides)
|
43
|
-
add_task "Splicing in slides from #{user_slides}" do
|
44
|
-
FileSplicer.insert!(user_slides,
|
45
|
-
into: file,
|
46
|
-
after: '<div class="slides">')
|
47
|
-
end
|
48
|
-
end
|
49
|
-
|
50
|
-
def replace_title(file, title)
|
51
|
-
old_title = 'reveal.js - The HTML Presentation Framework'
|
52
|
-
new_title = title
|
53
|
-
add_task 'Replacing the <title>' do
|
54
|
-
FileStringReplacer.replace!(file,
|
55
|
-
old: old_title,
|
56
|
-
new: new_title)
|
57
|
-
end
|
58
|
-
end
|
59
|
-
|
60
|
-
def replace_author(file, author)
|
61
|
-
old_author = 'name="author" content="Hakim El Hattab"'
|
62
|
-
new_author = 'name="author" content="' + author + '"'
|
63
|
-
add_task "Replacing the <meta name='author'>" do
|
64
|
-
FileStringReplacer.replace!(file,
|
65
|
-
old: old_author,
|
66
|
-
new: new_author)
|
67
|
-
end
|
68
|
-
end
|
69
|
-
|
70
|
-
def replace_theme(file, theme)
|
71
|
-
old_theme = 'href="css/theme/default.css" id="theme"'
|
72
|
-
new_theme = 'href="css/theme/' + theme + '.css" id="theme"'
|
73
|
-
add_task 'Replacing the core theme' do
|
74
|
-
FileStringReplacer.replace!(file,
|
75
|
-
old: old_theme,
|
76
|
-
new: new_theme)
|
77
|
-
end
|
78
|
-
end
|
79
|
-
|
80
|
-
end
|
81
|
-
end
|
@@ -1,39 +0,0 @@
|
|
1
|
-
module RevealCK
|
2
|
-
#
|
3
|
-
# Public: A SlidesHtmlBuilder knows how to create the intermediate
|
4
|
-
# file slides.html. This file is a users generate slide content, and
|
5
|
-
# is ultimately inserted within reveal.js.
|
6
|
-
#
|
7
|
-
# A slides.html can be created from a template or from an instance
|
8
|
-
# of a Presentation.
|
9
|
-
#
|
10
|
-
class SlidesHtmlBuilder
|
11
|
-
|
12
|
-
def initialize(args)
|
13
|
-
@input_file = args[:input_file]
|
14
|
-
@presentation = args[:presentation]
|
15
|
-
missing_info = 'either :input_file or :presentation are required'
|
16
|
-
raise missing_info unless @input_file || @presentation
|
17
|
-
end
|
18
|
-
|
19
|
-
def render
|
20
|
-
if @input_file
|
21
|
-
if @input_file.end_with? '.rb'
|
22
|
-
presentation = RevealCK::PresentationDSL.load @input_file
|
23
|
-
presentation.content
|
24
|
-
else
|
25
|
-
template = TemplateProcessor.open @input_file
|
26
|
-
template.output({}, {})
|
27
|
-
end
|
28
|
-
else
|
29
|
-
@presentation.content
|
30
|
-
end
|
31
|
-
end
|
32
|
-
|
33
|
-
def write_to(args)
|
34
|
-
file = args[:file] || raise(':file is required')
|
35
|
-
File.open(file, 'w') { |file| file << render }
|
36
|
-
end
|
37
|
-
|
38
|
-
end
|
39
|
-
end
|
@@ -1,33 +0,0 @@
|
|
1
|
-
module RevealCK
|
2
|
-
#
|
3
|
-
# Public: This class is home to a simple algorithm for looking up
|
4
|
-
# files in a series of directories. Directory order matters, and the
|
5
|
-
# first match for the file will be returned. It'll raise if it can't
|
6
|
-
# find the file you've asked for.
|
7
|
-
#
|
8
|
-
class TemplateFinder
|
9
|
-
|
10
|
-
attr_reader :paths
|
11
|
-
|
12
|
-
def initialize(args = {})
|
13
|
-
@paths = args[:paths] || default_paths
|
14
|
-
end
|
15
|
-
|
16
|
-
def default_paths
|
17
|
-
pwd = Dir.pwd
|
18
|
-
pwd_templates = pwd, 'templates'
|
19
|
-
reveal_ck_templates = File.join RevealCK::LOCATION, 'templates'
|
20
|
-
[pwd, pwd_templates, reveal_ck_templates]
|
21
|
-
end
|
22
|
-
|
23
|
-
def find(template_name)
|
24
|
-
paths.each do |path|
|
25
|
-
glob_pattern = "#{File.join(path, template_name)}*"
|
26
|
-
matching_templates = Dir.glob glob_pattern
|
27
|
-
return matching_templates[0] unless matching_templates.empty?
|
28
|
-
end
|
29
|
-
raise "Unable to find #{template_name} in #{paths}"
|
30
|
-
end
|
31
|
-
|
32
|
-
end
|
33
|
-
end
|
@@ -1,28 +0,0 @@
|
|
1
|
-
#
|
2
|
-
# Setup Slim
|
3
|
-
require 'slim'
|
4
|
-
::Slim::Engine.set_default_options pretty: true
|
5
|
-
|
6
|
-
module RevealCK
|
7
|
-
#
|
8
|
-
# Public: A TemplateProcessor is given a template and expected to
|
9
|
-
# render it.
|
10
|
-
#
|
11
|
-
class TemplateProcessor
|
12
|
-
|
13
|
-
require 'tilt'
|
14
|
-
|
15
|
-
def initialize(file)
|
16
|
-
@template = Tilt.new file
|
17
|
-
end
|
18
|
-
|
19
|
-
def output(scope = nil, locals = {})
|
20
|
-
@template.render scope, locals
|
21
|
-
end
|
22
|
-
|
23
|
-
def self.open(file)
|
24
|
-
TemplateProcessor.new file
|
25
|
-
end
|
26
|
-
|
27
|
-
end
|
28
|
-
end
|
@@ -1,375 +0,0 @@
|
|
1
|
-
<!doctype html>
|
2
|
-
<html lang="en">
|
3
|
-
|
4
|
-
<head>
|
5
|
-
<meta charset="utf-8">
|
6
|
-
|
7
|
-
<title>reveal.js - The HTML Presentation Framework</title>
|
8
|
-
|
9
|
-
<meta name="description" content="A framework for easily creating beautiful presentations using HTML">
|
10
|
-
<meta name="author" content="Hakim El Hattab">
|
11
|
-
|
12
|
-
<meta name="apple-mobile-web-app-capable" content="yes" />
|
13
|
-
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
14
|
-
|
15
|
-
<link rel="stylesheet" href="css/reveal.min.css">
|
16
|
-
<link rel="stylesheet" href="css/theme/default.css" id="theme">
|
17
|
-
|
18
|
-
<!-- For syntax highlighting -->
|
19
|
-
<link rel="stylesheet" href="lib/css/zenburn.css">
|
20
|
-
|
21
|
-
<!-- If the query includes 'print-pdf', use the PDF print sheet -->
|
22
|
-
<script>
|
23
|
-
document.write( '<link rel="stylesheet" href="css/print/' + ( window.location.search.match( /print-pdf/gi ) ? 'pdf' : 'paper' ) + '.css" type="text/css" media="print">' );
|
24
|
-
</script>
|
25
|
-
|
26
|
-
<!--[if lt IE 9]>
|
27
|
-
<script src="lib/js/html5shiv.js"></script>
|
28
|
-
<![endif]-->
|
29
|
-
</head>
|
30
|
-
|
31
|
-
<body>
|
32
|
-
|
33
|
-
<div class="reveal">
|
34
|
-
|
35
|
-
<!-- Any section element inside of this container is displayed as a slide -->
|
36
|
-
<div class="slides">
|
37
|
-
|
38
|
-
<section>
|
39
|
-
<h1>Reveal.js</h1>
|
40
|
-
<h3>HTML Presentations Made Easy</h3>
|
41
|
-
<p>
|
42
|
-
<small>Created by <a href="http://hakim.se">Hakim El Hattab</a> / <a href="http://twitter.com/hakimel">@hakimel</a></small>
|
43
|
-
</p>
|
44
|
-
</section>
|
45
|
-
|
46
|
-
<section>
|
47
|
-
<h2>Heads Up</h2>
|
48
|
-
<p>
|
49
|
-
reveal.js is a framework for easily creating beautiful presentations using HTML. You'll need a browser with
|
50
|
-
support for CSS 3D transforms to see it in its full glory.
|
51
|
-
</p>
|
52
|
-
|
53
|
-
<aside class="notes">
|
54
|
-
Oh hey, these are some notes. They'll be hidden in your presentation, but you can see them if you open the speaker notes window (hit 's' on your keyboard).
|
55
|
-
</aside>
|
56
|
-
</section>
|
57
|
-
|
58
|
-
<!-- Example of nested vertical slides -->
|
59
|
-
<section>
|
60
|
-
<section>
|
61
|
-
<h2>Vertical Slides</h2>
|
62
|
-
<p>
|
63
|
-
Slides can be nested inside of other slides,
|
64
|
-
try pressing <a href="#" class="navigate-down">down</a>.
|
65
|
-
</p>
|
66
|
-
<a href="#" class="image navigate-down">
|
67
|
-
<img width="178" height="238" src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Down arrow">
|
68
|
-
</a>
|
69
|
-
</section>
|
70
|
-
<section>
|
71
|
-
<h2>Basement Level 1</h2>
|
72
|
-
<p>Press down or up to navigate.</p>
|
73
|
-
</section>
|
74
|
-
<section>
|
75
|
-
<h2>Basement Level 2</h2>
|
76
|
-
<p>Cornify</p>
|
77
|
-
<a class="test" href="http://cornify.com">
|
78
|
-
<img width="280" height="326" src="https://s3.amazonaws.com/hakim-static/reveal-js/cornify.gif" alt="Unicorn">
|
79
|
-
</a>
|
80
|
-
</section>
|
81
|
-
<section>
|
82
|
-
<h2>Basement Level 3</h2>
|
83
|
-
<p>That's it, time to go back up.</p>
|
84
|
-
<a href="#/2" class="image">
|
85
|
-
<img width="178" height="238" src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Up arrow" style="-webkit-transform: rotate(180deg);">
|
86
|
-
</a>
|
87
|
-
</section>
|
88
|
-
</section>
|
89
|
-
|
90
|
-
<section>
|
91
|
-
<h2>Point of View</h2>
|
92
|
-
<p>
|
93
|
-
Press <strong>ESC</strong> to enter the slide overview. Hold down alt and click on any element to zoom in on it using <a href="http://lab.hakim.se/zoom-js">zoom.js</a>. Alt + click anywhere to zoom back out.
|
94
|
-
</p>
|
95
|
-
</section>
|
96
|
-
|
97
|
-
<section>
|
98
|
-
<h2>rvl.io</h2>
|
99
|
-
<p>
|
100
|
-
If you don't like writing slides in HTML you can use the online editor <a href="http://www.rvl.io" target="_blank">rvl.io</a>.
|
101
|
-
</p>
|
102
|
-
</section>
|
103
|
-
|
104
|
-
<section>
|
105
|
-
<h2>Works in Mobile Safari</h2>
|
106
|
-
<p>
|
107
|
-
Try it out! You can swipe through the slides and pinch your way to the overview.
|
108
|
-
</p>
|
109
|
-
</section>
|
110
|
-
|
111
|
-
<section>
|
112
|
-
<h2>Marvelous Unordered List</h2>
|
113
|
-
<ul>
|
114
|
-
<li>No order here</li>
|
115
|
-
<li>Or here</li>
|
116
|
-
<li>Or here</li>
|
117
|
-
<li>Or here</li>
|
118
|
-
</ul>
|
119
|
-
</section>
|
120
|
-
|
121
|
-
<section>
|
122
|
-
<h2>Fantastic Ordered List</h2>
|
123
|
-
<ol>
|
124
|
-
<li>One is smaller than...</li>
|
125
|
-
<li>Two is smaller than...</li>
|
126
|
-
<li>Three!</li>
|
127
|
-
</ol>
|
128
|
-
</section>
|
129
|
-
|
130
|
-
<section data-markdown>
|
131
|
-
<script type="text/template">
|
132
|
-
## Markdown support
|
133
|
-
|
134
|
-
For those of you who like that sort of thing. Instructions and a bit more info available [here](https://github.com/hakimel/reveal.js#markdown).
|
135
|
-
|
136
|
-
<section data-markdown>
|
137
|
-
## Markdown support
|
138
|
-
|
139
|
-
For those of you who like that sort of thing.
|
140
|
-
Instructions and a bit more info available [here](https://github.com/hakimel/reveal.js#markdown).
|
141
|
-
</section>
|
142
|
-
</script>
|
143
|
-
</section>
|
144
|
-
|
145
|
-
<section id="transitions">
|
146
|
-
<h2>Transition Styles</h2>
|
147
|
-
<p>
|
148
|
-
You can select from different transitions, like: <br>
|
149
|
-
<a href="?transition=cube#/transitions">Cube</a> -
|
150
|
-
<a href="?transition=page#/transitions">Page</a> -
|
151
|
-
<a href="?transition=concave#/transitions">Concave</a> -
|
152
|
-
<a href="?transition=zoom#/transitions">Zoom</a> -
|
153
|
-
<a href="?transition=linear#/transitions">Linear</a> -
|
154
|
-
<a href="?transition=fade#/transitions">Fade</a> -
|
155
|
-
<a href="?transition=none#/transitions">None</a> -
|
156
|
-
<a href="?#/transitions">Default</a>
|
157
|
-
</p>
|
158
|
-
</section>
|
159
|
-
|
160
|
-
<section id="themes">
|
161
|
-
<h2>Themes</h2>
|
162
|
-
<p>
|
163
|
-
Reveal.js comes with a few themes built in: <br>
|
164
|
-
<a href="?theme=sky#/themes">Sky</a> -
|
165
|
-
<a href="?theme=beige#/themes">Beige</a> -
|
166
|
-
<a href="?theme=simple#/themes">Simple</a> -
|
167
|
-
<a href="?theme=serif#/themes">Serif</a> -
|
168
|
-
<a href="?theme=night#/themes">Night</a> -
|
169
|
-
<a href="?#/themes">Default</a>
|
170
|
-
</p>
|
171
|
-
<p>
|
172
|
-
<small>
|
173
|
-
* Theme demos are loaded after the presentation which leads to flicker. In production you should load your theme in the <code><head></code> using a <code><link></code>.
|
174
|
-
</small>
|
175
|
-
</p>
|
176
|
-
</section>
|
177
|
-
|
178
|
-
<section>
|
179
|
-
<section data-state="alert">
|
180
|
-
<h2>Global State</h2>
|
181
|
-
<p>
|
182
|
-
Set <code>data-state="something"</code> on a slide and <code>"something"</code>
|
183
|
-
will be added as a class to the document element when the slide is open. This lets you
|
184
|
-
apply broader style changes, like switching the background.
|
185
|
-
</p>
|
186
|
-
<a href="#" class="image navigate-down">
|
187
|
-
<img width="178" height="238" src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Down arrow">
|
188
|
-
</a>
|
189
|
-
</section>
|
190
|
-
<section data-state="blackout">
|
191
|
-
<h2>"blackout"</h2>
|
192
|
-
<a href="#" class="image navigate-down">
|
193
|
-
<img width="178" height="238" src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Down arrow">
|
194
|
-
</a>
|
195
|
-
</section>
|
196
|
-
<section data-state="soothe">
|
197
|
-
<h2>"soothe"</h2>
|
198
|
-
<a href="#" class="image navigate-next">
|
199
|
-
<img width="178" height="238" src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Up arrow" style="-webkit-transform: rotate(-90deg);">
|
200
|
-
</a>
|
201
|
-
</section>
|
202
|
-
</section>
|
203
|
-
|
204
|
-
<section data-state="customevent">
|
205
|
-
<h2>Custom Events</h2>
|
206
|
-
<p>
|
207
|
-
Additionally custom events can be triggered on a per slide basis by binding to the <code>data-state</code> name.
|
208
|
-
</p>
|
209
|
-
<pre><code contenteditable style="font-size: 18px; margin-top: 20px;">Reveal.addEventListener( 'customevent', function() {
|
210
|
-
console.log( '"customevent" has fired' );
|
211
|
-
} );
|
212
|
-
</code></pre>
|
213
|
-
</section>
|
214
|
-
|
215
|
-
<section>
|
216
|
-
<h2>Clever Quotes</h2>
|
217
|
-
<p>
|
218
|
-
These guys come in two forms, inline: <q cite="http://searchservervirtualization.techtarget.com/definition/Our-Favorite-Technology-Quotations">
|
219
|
-
The nice thing about standards is that there are so many to choose from</q> and block:
|
220
|
-
</p>
|
221
|
-
<blockquote cite="http://searchservervirtualization.techtarget.com/definition/Our-Favorite-Technology-Quotations">
|
222
|
-
For years there has been a theory that millions of monkeys typing at random on millions of typewriters would
|
223
|
-
reproduce the entire works of Shakespeare. The Internet has proven this theory to be untrue.
|
224
|
-
</blockquote>
|
225
|
-
</section>
|
226
|
-
|
227
|
-
<section>
|
228
|
-
<h2>Pretty Code</h2>
|
229
|
-
<pre><code contenteditable>
|
230
|
-
function linkify( selector ) {
|
231
|
-
if( supports3DTransforms ) {
|
232
|
-
|
233
|
-
var nodes = document.querySelectorAll( selector );
|
234
|
-
|
235
|
-
for( var i = 0, len = nodes.length; i < len; i++ ) {
|
236
|
-
var node = nodes[i];
|
237
|
-
|
238
|
-
if( !node.className ) ) {
|
239
|
-
node.className += ' roll';
|
240
|
-
}
|
241
|
-
};
|
242
|
-
}
|
243
|
-
}
|
244
|
-
</code></pre>
|
245
|
-
<p>Courtesy of <a href="http://softwaremaniacs.org/soft/highlight/en/description/">highlight.js</a>.</p>
|
246
|
-
</section>
|
247
|
-
|
248
|
-
<section>
|
249
|
-
<h2>Intergalactic Interconnections</h2>
|
250
|
-
<p>
|
251
|
-
You can link between slides internally,
|
252
|
-
<a href="#/2/3">like this</a>.
|
253
|
-
</p>
|
254
|
-
</section>
|
255
|
-
|
256
|
-
<section>
|
257
|
-
<section>
|
258
|
-
<h2>Fragmented Views</h2>
|
259
|
-
<p>Hit the next arrow...</p>
|
260
|
-
<p class="fragment">... to step through ...</p>
|
261
|
-
<ol>
|
262
|
-
<li class="fragment"><code>any type</code></li>
|
263
|
-
<li class="fragment"><em>of view</em></li>
|
264
|
-
<li class="fragment"><strong>fragments</strong></li>
|
265
|
-
</ol>
|
266
|
-
|
267
|
-
<aside class="notes">
|
268
|
-
This slide has fragments which are also stepped through in the notes window.
|
269
|
-
</aside>
|
270
|
-
</section>
|
271
|
-
<section>
|
272
|
-
<h2>Fragment Styles</h2>
|
273
|
-
<p>There's a few styles of fragments, like:</p>
|
274
|
-
<p class="fragment grow">grow</p>
|
275
|
-
<p class="fragment shrink">shrink</p>
|
276
|
-
<p class="fragment roll-in">roll-in</p>
|
277
|
-
<p class="fragment fade-out">fade-out</p>
|
278
|
-
<p class="fragment highlight-red">highlight-red</p>
|
279
|
-
<p class="fragment highlight-green">highlight-green</p>
|
280
|
-
<p class="fragment highlight-blue">highlight-blue</p>
|
281
|
-
</section>
|
282
|
-
</section>
|
283
|
-
|
284
|
-
<section>
|
285
|
-
<h2>Spectacular image!</h2>
|
286
|
-
<a class="image" href="http://lab.hakim.se/meny/" target="_blank">
|
287
|
-
<img width="320" height="299" src="http://s3.amazonaws.com/hakim-static/portfolio/images/meny.png" alt="Meny">
|
288
|
-
</a>
|
289
|
-
</section>
|
290
|
-
|
291
|
-
<section>
|
292
|
-
<h2>Export to PDF</h2>
|
293
|
-
<p>Presentations can be <a href="https://github.com/hakimel/reveal.js#pdf-export">exported to PDF</a>, below is an example that's been uploaded to SlideShare.</p>
|
294
|
-
<iframe id="slideshare" src="http://www.slideshare.net/slideshow/embed_code/13872948" width="455" height="356" style="margin:0;overflow:hidden;border:1px solid #CCC;border-width:1px 1px 0;margin-bottom:5px" allowfullscreen> </iframe>
|
295
|
-
<script>
|
296
|
-
document.getElementById('slideshare').attributeName = 'allowfullscreen';
|
297
|
-
</script>
|
298
|
-
</section>
|
299
|
-
|
300
|
-
<section>
|
301
|
-
<h2>Take a Moment</h2>
|
302
|
-
<p>
|
303
|
-
Press b or period on your keyboard to enter the 'paused' mode. This mode is helpful when you want to take distracting slides off the screen
|
304
|
-
during a presentation.
|
305
|
-
</p>
|
306
|
-
</section>
|
307
|
-
|
308
|
-
<section>
|
309
|
-
<h2>Stellar Links</h2>
|
310
|
-
<ul>
|
311
|
-
<li><a href="https://github.com/hakimel/reveal.js">Source code on GitHub</a></li>
|
312
|
-
<li><a href="http://hakim.se/projects/reveal-js">Leave feedback on my site</a></li>
|
313
|
-
<li><a href="http://twitter.com/hakimel">Follow me on Twitter</a></li>
|
314
|
-
</ul>
|
315
|
-
</section>
|
316
|
-
|
317
|
-
<section>
|
318
|
-
<h2>It's free</h2>
|
319
|
-
<p>
|
320
|
-
reveal.js and <a href="http://www.rvl.io">rvl.io</a> are entirely free but if you'd like to support the projects you can donate below.
|
321
|
-
Donations will go towards hosting and domain costs.
|
322
|
-
</p>
|
323
|
-
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
|
324
|
-
<input type="hidden" name="cmd" value="_donations">
|
325
|
-
<input type="hidden" name="business" value="hakim.elhattab@gmail.com">
|
326
|
-
<input type="hidden" name="lc" value="US">
|
327
|
-
<input type="hidden" name="item_name" value="reveal.js / rvl.io">
|
328
|
-
<input type="hidden" name="no_note" value="0">
|
329
|
-
<input type="hidden" name="currency_code" value="USD">
|
330
|
-
<input type="hidden" name="bn" value="PP-DonationsBF:btn_donate_LG.gif:NonHostedGuest">
|
331
|
-
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_donate_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
|
332
|
-
</form>
|
333
|
-
</section>
|
334
|
-
|
335
|
-
<section>
|
336
|
-
<h1>THE END</h1>
|
337
|
-
<h3>BY Hakim El Hattab / hakim.se</h3>
|
338
|
-
</section>
|
339
|
-
|
340
|
-
</div>
|
341
|
-
|
342
|
-
</div>
|
343
|
-
|
344
|
-
<script src="lib/js/head.min.js"></script>
|
345
|
-
<script src="js/reveal.min.js"></script>
|
346
|
-
|
347
|
-
<script>
|
348
|
-
|
349
|
-
// Full list of configuration options available here:
|
350
|
-
// https://github.com/hakimel/reveal.js#configuration
|
351
|
-
Reveal.initialize({
|
352
|
-
controls: true,
|
353
|
-
progress: true,
|
354
|
-
history: true,
|
355
|
-
center: true,
|
356
|
-
|
357
|
-
theme: Reveal.getQueryHash().theme, // available themes are in /css/theme
|
358
|
-
transition: Reveal.getQueryHash().transition || 'default', // default/cube/page/concave/zoom/linear/fade/none
|
359
|
-
|
360
|
-
// Optional libraries used to extend on reveal.js
|
361
|
-
dependencies: [
|
362
|
-
{ src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
|
363
|
-
{ src: 'plugin/markdown/showdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
|
364
|
-
{ src: 'plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
|
365
|
-
{ src: 'plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
|
366
|
-
{ src: 'plugin/zoom-js/zoom.js', async: true, condition: function() { return !!document.body.classList; } },
|
367
|
-
{ src: 'plugin/notes/notes.js', async: true, condition: function() { return !!document.body.classList; } }
|
368
|
-
// { src: 'plugin/remotes/remotes.js', async: true, condition: function() { return !!document.body.classList; } }
|
369
|
-
]
|
370
|
-
});
|
371
|
-
|
372
|
-
</script>
|
373
|
-
|
374
|
-
</body>
|
375
|
-
</html>
|