reveal-ck 3.9.2 → 4.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (82) hide show
  1. checksums.yaml +5 -5
  2. data/features/step_definitions/serve_steps.rb +1 -1
  3. data/files/reveal-ck/templates/index.html/body.html.erb +0 -2
  4. data/files/reveal-ck/templates/index.html/head.html.erb +6 -6
  5. data/files/reveal-ck/templates/index.html/index.html.erb +2 -2
  6. data/files/reveal-ck/templates/index.html/script.js.erb +4 -6
  7. data/files/reveal.js/LICENSE +1 -1
  8. data/files/reveal.js/README.md +268 -82
  9. data/files/reveal.js/bower.json +1 -4
  10. data/files/reveal.js/css/reset.css +30 -0
  11. data/files/reveal.js/css/reveal.css +114 -99
  12. data/files/reveal.js/css/reveal.scss +108 -95
  13. data/files/reveal.js/css/theme/README.md +1 -1
  14. data/files/reveal.js/css/theme/beige.css +1 -1
  15. data/files/reveal.js/css/theme/black.css +4 -4
  16. data/files/reveal.js/css/theme/blood.css +1 -1
  17. data/files/reveal.js/css/theme/league.css +1 -1
  18. data/files/reveal.js/css/theme/moon.css +1 -1
  19. data/files/reveal.js/css/theme/night.css +1 -1
  20. data/files/reveal.js/css/theme/serif.css +1 -1
  21. data/files/reveal.js/css/theme/simple.css +1 -1
  22. data/files/reveal.js/css/theme/sky.css +1 -1
  23. data/files/reveal.js/css/theme/solarized.css +1 -1
  24. data/files/reveal.js/css/theme/source/black.scss +1 -1
  25. data/files/reveal.js/css/theme/template/settings.scss +3 -1
  26. data/files/reveal.js/css/theme/template/theme.scss +3 -3
  27. data/files/reveal.js/css/theme/white.css +1 -1
  28. data/files/reveal.js/demo.html +35 -26
  29. data/files/reveal.js/{Gruntfile.js → gruntfile.js} +21 -25
  30. data/files/reveal.js/index.html +5 -4
  31. data/files/reveal.js/js/reveal.js +961 -347
  32. data/files/reveal.js/lib/css/monokai.css +71 -0
  33. data/files/reveal.js/lib/js/promise.js +2 -0
  34. data/files/reveal.js/package-lock.json +5703 -0
  35. data/files/reveal.js/package.json +13 -12
  36. data/files/reveal.js/plugin/highlight/highlight.js +247 -21
  37. data/files/reveal.js/plugin/markdown/example.html +1 -3
  38. data/files/reveal.js/plugin/markdown/markdown.js +107 -73
  39. data/files/reveal.js/plugin/markdown/marked.js +3 -3
  40. data/files/reveal.js/plugin/math/math.js +51 -26
  41. data/files/reveal.js/plugin/notes/notes.html +138 -76
  42. data/files/reveal.js/plugin/notes/notes.js +46 -15
  43. data/files/reveal.js/plugin/search/search.js +1 -1
  44. data/files/reveal.js/plugin/zoom-js/zoom.js +22 -17
  45. data/files/reveal.js/test/assets/external-script-a.js +1 -0
  46. data/files/reveal.js/test/assets/external-script-b.js +1 -0
  47. data/files/reveal.js/test/assets/external-script-c.js +1 -0
  48. data/files/reveal.js/test/assets/external-script-d.js +1 -0
  49. data/files/reveal.js/test/examples/assets/beeping.txt +2 -0
  50. data/files/reveal.js/test/examples/assets/beeping.wav +0 -0
  51. data/files/reveal.js/test/examples/embedded-media.html +5 -1
  52. data/files/reveal.js/test/examples/math.html +23 -3
  53. data/files/reveal.js/test/examples/slide-backgrounds.html +0 -1
  54. data/files/reveal.js/test/examples/slide-transitions.html +0 -1
  55. data/files/reveal.js/test/test-dependencies-async.html +78 -0
  56. data/files/reveal.js/test/test-dependencies.html +54 -0
  57. data/files/reveal.js/test/test-grid-navigation.html +74 -0
  58. data/files/reveal.js/test/test-iframe-backgrounds.html +104 -0
  59. data/files/reveal.js/test/test-iframes.html +108 -0
  60. data/files/reveal.js/test/test-markdown-element-attributes.html +1 -3
  61. data/files/reveal.js/test/test-markdown-external.html +5 -4
  62. data/files/reveal.js/test/test-markdown-options.html +0 -1
  63. data/files/reveal.js/test/test-markdown-slide-attributes.html +0 -1
  64. data/files/reveal.js/test/test-markdown.html +0 -1
  65. data/files/reveal.js/test/test-pdf.html +1 -2
  66. data/files/reveal.js/test/test-plugins.html +105 -0
  67. data/files/reveal.js/test/test-state.html +139 -0
  68. data/files/reveal.js/test/test.html +3 -4
  69. data/files/reveal.js/test/test.js +21 -0
  70. data/lib/reveal-ck/builders/create_index_html.rb +0 -1
  71. data/lib/reveal-ck/builders/index_html.rb +2 -4
  72. data/lib/reveal-ck/commands/listen_to_reload_browser.rb +4 -1
  73. data/lib/reveal-ck/commands/serve.rb +2 -2
  74. data/lib/reveal-ck/commands/start_web_server.rb +1 -1
  75. data/lib/reveal-ck/commands/thread_waker.rb +1 -1
  76. data/lib/reveal-ck/config.rb +1 -1
  77. data/lib/reveal-ck/version.rb +1 -1
  78. data/spec/lib/reveal-ck/builders/index_html_spec.rb +1 -11
  79. data/spec/lib/reveal-ck/commands/thread_waker_spec.rb +2 -0
  80. metadata +94 -80
  81. data/files/reveal.js/lib/js/classList.js +0 -2
  82. data/files/reveal.js/lib/js/head.min.js +0 -6
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
- SHA1:
3
- metadata.gz: 4093d4d0c648ae02fd855942ef19ba2d9566bc2b
4
- data.tar.gz: 1f023ef450366ca9896973bbb51ffdc738622882
2
+ SHA256:
3
+ metadata.gz: 9175481e144af6731e172e58bded809c983ae231d44b5f12da62ce8466249f17
4
+ data.tar.gz: 503b85452835fc0bf1f14c2509b5a10ef9157cfbf1553be36b6af1e851747153
5
5
  SHA512:
6
- metadata.gz: 3ee1f0e4a0d87d7b74682e02e3cb6e0d0eff885b17be1d72dd16dafc96d58172b02e221b30f7003b28294e816159bfdb4b52ece11bc315f4f58ea54e40e6506e
7
- data.tar.gz: 8963e1e646ab2db39639eda2eb2aeec299dbedf5a5c1365f53b80e7044aca7a848d30556b9bab45893638066239505664416faa6e0b5d60dda96af1eb5b423c8
6
+ metadata.gz: 0c9de027d1bb0c6afbba93e393b255ed754ac95e03d047d3ced30ef2ceaf115f4e20912263657d611bad1761b3fa4a1b83ee3f4364512ac321de72bd8b43adc5
7
+ data.tar.gz: 7a3ec8eb205b7fd7f683c730b28072d39f1bebd4ad3b93fae77325bf268a8c974b150b39fd90f1baaf60e651b908b08ca99f55ffb5b0fcad17a56db892ff01f8
data/features/step_definitions/serve_steps.rb CHANGED
@@ -1,5 +1,5 @@
1
1
  When(/^I temporarily start reveal\-ck serve with host "(.*?)"$/) do |host|
2
2
  port = rand(10_000..11_000)
3
3
  cmd = "reveal-ck serve --port #{port} --host #{host}"
4
- run("#{cmd} --test-quit-after-starting 2")
4
+ run_command("#{cmd} --test-quit-after-starting 2")
5
5
  end
data/files/reveal-ck/templates/index.html/body.html.erb CHANGED
@@ -1,11 +1,9 @@
1
1
  <div class="reveal">
2
- <!-- Any section element inside of this container is displayed as a slide -->
3
2
  <div class="slides">
4
3
  <%= File.open(slides_html).read %>
5
4
  </div>
6
5
  </div>
7
6
 
8
- <script src="lib/js/head.min.js"></script>
9
7
  <script src="js/reveal.js"></script>
10
8
 
11
9
  <% js_files.each do |file| %>
data/files/reveal-ck/templates/index.html/head.html.erb CHANGED
@@ -1,4 +1,5 @@
1
1
  <meta charset="utf-8">
2
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
2
3
 
3
4
  <title><%= config.title %></title>
4
5
 
@@ -19,11 +20,14 @@
19
20
 
20
21
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui">
21
22
 
23
+
24
+ <!-- Code syntax highlighting -->
25
+ <link rel="stylesheet" href="css/reset.css">
22
26
  <link rel="stylesheet" href="css/reveal.css">
23
27
  <link rel="stylesheet" href="css/theme/<%= config.theme %>.css" id="theme">
24
28
 
25
- <!-- Code syntax highlighting -->
26
- <link rel="stylesheet" href="lib/css/zenburn.css">
29
+ <!-- Theme used for syntax highlighting of code -->
30
+ <link rel="stylesheet" href="lib/css/monokai.css">
27
31
 
28
32
  <link rel="stylesheet" href="css/reveal-ck.css">
29
33
 
@@ -39,7 +43,3 @@
39
43
  link.href = window.location.search.match( /print-pdf/gi ) ? 'css/print/pdf.css' : 'css/print/paper.css';
40
44
  document.getElementsByTagName( 'head' )[0].appendChild( link );
41
45
  </script>
42
-
43
- <!--[if lt IE 9]>
44
- <script src="lib/js/html5shiv.js"></script>
45
- <![endif]-->
data/files/reveal-ck/templates/index.html/index.html.erb CHANGED
@@ -1,6 +1,6 @@
1
1
  <!doctype html>
2
- <html lang="en">
3
- <head prefix="<%= head_prefix %>">
2
+ <html>
3
+ <head>
4
4
  <%= head %>
5
5
  </head>
6
6
 
data/files/reveal-ck/templates/index.html/script.js.erb CHANGED
@@ -6,13 +6,11 @@
6
6
  }
7
7
  var baseOptions = {
8
8
  transition: '<%= config.transition %>',
9
-
9
+ hash: true,
10
10
  dependencies: [
11
- { src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
12
- { src: 'plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
13
- { src: 'plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
14
- { src: 'plugin/highlight/highlight.js', async: true, condition: function() { return !!document.querySelector( 'pre code' ); }, callback: function() { hljs.initHighlightingOnLoad(); } },
15
- { src: 'plugin/zoom-js/zoom.js', async: true },
11
+ { src: 'plugin/markdown/marked.js' },
12
+ { src: 'plugin/markdown/markdown.js' },
13
+ { src: 'plugin/highlight/highlight.js' },
16
14
  { src: 'plugin/notes/notes.js', async: true }
17
15
  ]
18
16
  };
data/files/reveal.js/LICENSE CHANGED
@@ -1,4 +1,4 @@
1
- Copyright (C) 2018 Hakim El Hattab, http://hakim.se, and reveal.js contributors
1
+ Copyright (C) 2020 Hakim El Hattab, http://hakim.se, and reveal.js contributors
2
2
 
3
3
  Permission is hereby granted, free of charge, to any person obtaining a copy
4
4
  of this software and associated documentation files (the "Software"), to deal
data/files/reveal.js/README.md CHANGED
@@ -1,13 +1,20 @@
1
1
  # reveal.js [![Build Status](https://travis-ci.org/hakimel/reveal.js.svg?branch=master)](https://travis-ci.org/hakimel/reveal.js) <a href="https://slides.com?ref=github"><img src="https://s3.amazonaws.com/static.slid.es/images/slides-github-banner-320x40.png?1" alt="Slides" width="160" height="20"></a>
2
2
 
3
- A framework for easily creating beautiful presentations using HTML. [Check out the live demo](http://revealjs.com/).
3
+ A framework for easily creating beautiful presentations using HTML. [Check out the live demo](https://revealjs.com/).
4
4
 
5
- reveal.js comes with a broad range of features including [nested slides](https://github.com/hakimel/reveal.js#markup), [Markdown contents](https://github.com/hakimel/reveal.js#markdown), [PDF export](https://github.com/hakimel/reveal.js#pdf-export), [speaker notes](https://github.com/hakimel/reveal.js#speaker-notes) and a [JavaScript API](https://github.com/hakimel/reveal.js#api). There's also a fully featured visual editor and platform for sharing reveal.js presentations at [slides.com](https://slides.com?ref=github).
5
+ reveal.js comes with a broad range of features including [nested slides](https://github.com/hakimel/reveal.js#markup), [Markdown support](https://github.com/hakimel/reveal.js#markdown), [PDF export](https://github.com/hakimel/reveal.js#pdf-export), [speaker notes](https://github.com/hakimel/reveal.js#speaker-notes) and a [JavaScript API](https://github.com/hakimel/reveal.js#api). There's also a fully featured visual editor and platform for sharing reveal.js presentations at [slides.com](https://slides.com?ref=github).
6
+
7
+ ### Supporting reveal.js
8
+ This project was started and is maintained by [@hakimel](https://github.com/hakimel/) with the help of many [contributions from the community](https://github.com/hakimel/reveal.js/graphs/contributors). The best way to support the project is to [become a paying member of Slides.com](https://slides.com/pricing)—the reveal.js presentation platform that Hakim is building.
6
9
 
7
10
 
8
11
  ## Table of contents
9
12
 
10
13
  - [Online Editor](#online-editor)
14
+ - [Installation](#installation)
15
+ - [Basic setup](#basic-setup)
16
+ - [Full setup](#full-setup)
17
+ - [Folder Structure](#folder-structure)
11
18
  - [Instructions](#instructions)
12
19
  - [Markup](#markup)
13
20
  - [Markdown](#markdown)
@@ -19,9 +26,11 @@ reveal.js comes with a broad range of features including [nested slides](https:/
19
26
  - [Ready Event](#ready-event)
20
27
  - [Auto-sliding](#auto-sliding)
21
28
  - [Keyboard Bindings](#keyboard-bindings)
29
+ - [Vertical Slide Navigation](#vertical-slide-navigation)
22
30
  - [Touch Navigation](#touch-navigation)
23
31
  - [Lazy Loading](#lazy-loading)
24
32
  - [API](#api)
33
+ - [Custom Key Bindings](#custom-key-bindings)
25
34
  - [Slide Changed Event](#slide-changed-event)
26
35
  - [Presentation State](#presentation-state)
27
36
  - [Slide States](#slide-states)
@@ -37,21 +46,19 @@ reveal.js comes with a broad range of features including [nested slides](https:/
37
46
  - [Fullscreen mode](#fullscreen-mode)
38
47
  - [Embedded media](#embedded-media)
39
48
  - [Stretching elements](#stretching-elements)
49
+ - [Resize Event](#resize-event)
40
50
  - [postMessage API](#postmessage-api)
41
51
  - [PDF Export](#pdf-export)
42
52
  - [Theming](#theming)
43
53
  - [Speaker Notes](#speaker-notes)
44
54
  - [Share and Print Speaker Notes](#share-and-print-speaker-notes)
45
55
  - [Server Side Speaker Notes](#server-side-speaker-notes)
56
+ - [Plugins](#plugins)
46
57
  - [Multiplexing](#multiplexing)
47
58
  - [Master presentation](#master-presentation)
48
59
  - [Client presentation](#client-presentation)
49
60
  - [Socket.io server](#socketio-server)
50
61
  - [MathJax](#mathjax)
51
- - [Installation](#installation)
52
- - [Basic setup](#basic-setup)
53
- - [Full setup](#full-setup)
54
- - [Folder Structure](#folder-structure)
55
62
  - [License](#license)
56
63
 
57
64
  #### More reading
@@ -67,6 +74,56 @@ reveal.js comes with a broad range of features including [nested slides](https:/
67
74
  Presentations are written using HTML or Markdown but there's also an online editor for those of you who prefer a graphical interface. Give it a try at [https://slides.com](https://slides.com?ref=github).
68
75
 
69
76
 
77
+ ## Installation
78
+
79
+ The **basic setup** is for authoring presentations only. The **full setup** gives you access to all reveal.js features and plugins such as speaker notes as well as the development tasks needed to make changes to the source.
80
+
81
+ ### Basic setup
82
+
83
+ The core of reveal.js is very easy to install. You'll simply need to download a copy of this repository and open the index.html file directly in your browser.
84
+
85
+ 1. Download the latest version of reveal.js from <https://github.com/hakimel/reveal.js/releases>
86
+ 2. Unzip and replace the example contents in index.html with your own
87
+ 3. Open index.html in a browser to view it
88
+
89
+ ### Full setup
90
+
91
+ Some reveal.js features, like external Markdown and speaker notes, require that presentations run from a local web server. The following instructions will set up such a server as well as all of the development tasks needed to make edits to the reveal.js source code.
92
+
93
+ 1. Install [Node.js](https://nodejs.org/) (9.0.0 or later)
94
+
95
+ 1. Clone the reveal.js repository
96
+ ```sh
97
+ $ git clone https://github.com/hakimel/reveal.js.git
98
+ ```
99
+
100
+ 1. Navigate to the reveal.js folder
101
+ ```sh
102
+ $ cd reveal.js
103
+ ```
104
+
105
+ 1. Install dependencies
106
+ ```sh
107
+ $ npm install
108
+ ```
109
+
110
+ 1. Serve the presentation and monitor source files for changes
111
+ ```sh
112
+ $ npm start
113
+ ```
114
+
115
+ 1. Open <http://localhost:8000> to view your presentation
116
+
117
+ You can change the port by using `npm start -- --port=8001`.
118
+
119
+ ### Folder Structure
120
+
121
+ - **css/** Core styles without which the project does not function
122
+ - **js/** Like above but for JavaScript
123
+ - **plugin/** Components that have been developed as extensions to reveal.js
124
+ - **lib/** All other third party assets (JavaScript, CSS, fonts)
125
+
126
+
70
127
  ## Instructions
71
128
 
72
129
  ### Markup
@@ -175,7 +232,7 @@ We use [marked](https://github.com/chjj/marked) to parse Markdown. To customise
175
232
  ```javascript
176
233
  Reveal.initialize({
177
234
  // Options which are passed into marked
178
- // See https://github.com/chjj/marked#options-1
235
+ // See https://marked.js.org/#/USING_ADVANCED.md#options
179
236
  markdown: {
180
237
  smartypants: true
181
238
  }
@@ -209,7 +266,11 @@ Reveal.initialize({
209
266
  // Display the page number of the current slide
210
267
  slideNumber: false,
211
268
 
212
- // Push each slide change to the browser history
269
+ // Add the current slide number to the URL hash so that reloading the
270
+ // page/copying the URL will return you to the same slide
271
+ hash: false,
272
+
273
+ // Push each slide change to the browser history. Implies `hash: true`
213
274
  history: false,
214
275
 
215
276
  // Enable keyboard shortcuts for navigation
@@ -230,6 +291,9 @@ Reveal.initialize({
230
291
  // Change the presentation direction to be RTL
231
292
  rtl: false,
232
293
 
294
+ // See https://github.com/hakimel/reveal.js/#navigation-mode
295
+ navigationMode: 'default',
296
+
233
297
  // Randomizes the order of slides each time the presentation loads
234
298
  shuffle: false,
235
299
 
@@ -257,6 +321,13 @@ Reveal.initialize({
257
321
  // - false: No media will autoplay, regardless of individual setting
258
322
  autoPlayMedia: null,
259
323
 
324
+ // Global override for preloading lazy-loaded iframes
325
+ // - null: Iframes with data-src AND data-preload will be loaded when within
326
+ // the viewDistance, iframes with only data-src will be loaded when visible
327
+ // - true: All iframes with data-src will be loaded when within the viewDistance
328
+ // - false: All iframes with data-src will be loaded only when visible
329
+ preloadIframes: null,
330
+
260
331
  // Number of milliseconds between automatically proceeding to the
261
332
  // next slide, disabled when set to 0, this value can be overwritten
262
333
  // by using a data-autoslide attribute on your slides
@@ -273,9 +344,28 @@ Reveal.initialize({
273
344
  // speaker view
274
345
  defaultTiming: 120,
275
346
 
347
+ // Specify the total time in seconds that is available to
348
+ // present. If this is set to a nonzero value, the pacing
349
+ // timer will work out the time available for each slide,
350
+ // instead of using the defaultTiming value
351
+ totalTime: 0,
352
+
353
+ // Specify the minimum amount of time you want to allot to
354
+ // each slide, if using the totalTime calculation method. If
355
+ // the automated time allocation causes slide pacing to fall
356
+ // below this threshold, then you will see an alert in the
357
+ // speaker notes window
358
+ minimumTimePerSlide: 0;
359
+
276
360
  // Enable slide navigation via mouse wheel
277
361
  mouseWheel: false,
278
362
 
363
+ // Hide cursor if inactive
364
+ hideInactiveCursor: true,
365
+
366
+ // Time before the cursor is hidden (in ms)
367
+ hideCursorTime: 5000,
368
+
279
369
  // Hides the address bar on mobile devices
280
370
  hideAddressBar: true,
281
371
 
@@ -296,6 +386,11 @@ Reveal.initialize({
296
386
  // Number of slides away from the current that are visible
297
387
  viewDistance: 3,
298
388
 
389
+ // Number of slides away from the current that are visible on mobile
390
+ // devices. It is advisable to set this to a lower number than
391
+ // viewDistance in order to save resources.
392
+ mobileViewDistance: 2,
393
+
299
394
  // Parallax background image
300
395
  parallaxBackgroundImage: '', // e.g. "'https://s3.amazonaws.com/hakim-static/reveal-js/reveal-parallax-1.jpg'"
301
396
 
@@ -373,15 +468,12 @@ Reveal.js doesn't _rely_ on any third party scripts to work but a few optional l
373
468
  ```javascript
374
469
  Reveal.initialize({
375
470
  dependencies: [
376
- // Cross-browser shim that fully implements classList - https://github.com/eligrey/classList.js/
377
- { src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
378
-
379
471
  // Interpret Markdown in <section> elements
380
472
  { src: 'plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
381
473
  { src: 'plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
382
474
 
383
475
  // Syntax highlight for <code> elements
384
- { src: 'plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
476
+ { src: 'plugin/highlight/highlight.js', async: true },
385
477
 
386
478
  // Zoom in and out with Alt+click
387
479
  { src: 'plugin/zoom-js/zoom.js', async: true },
@@ -401,8 +493,6 @@ You can add your own extensions using the same syntax. The following properties
401
493
  - **callback**: [optional] Function to execute when the script has loaded
402
494
  - **condition**: [optional] Function which must return true for the script to be loaded
403
495
 
404
- To load these dependencies, reveal.js requires [head.js](http://headjs.com/) *(a script loading library)* to be loaded before reveal.js.
405
-
406
496
  ### Ready Event
407
497
 
408
498
  A `ready` event is fired when reveal.js has loaded all non-async dependencies and is ready to start navigating. To check if reveal.js is already 'ready' you can call `Reveal.isReady()`.
@@ -456,6 +546,21 @@ Reveal.configure({
456
546
  });
457
547
  ```
458
548
 
549
+ ### Vertical Slide Navigation
550
+
551
+ Slides can be nested within other slides to create vertical stacks (see [Markup](#markup)). When presenting, you use the left/right arrows to step through the main (horizontal) slides. When you arrive at a vertical stack you can optionally press the up/down arrows to view the vertical slides or skip past them by pressing the right arrow. Here's an example showing a bird's-eye view of what this looks like in action:
552
+
553
+ <img src="https://static.slid.es/support/reveal.js-vertical-slides.gif" width="450">
554
+
555
+ #### Navigation Mode
556
+ You can fine tune the reveal.js navigation behavior by using the `navigationMode` config option. Note that these options are only useful for presentations that use a mix of horizontal and vertical slides. The following navigation modes are available:
557
+
558
+ | Value | Description |
559
+ | :--------------------------- | :---------- |
560
+ | default | Left/right arrow keys step between horizontal slides. Up/down arrow keys step between vertical slides. Space key steps through all slides (both horizontal and vertical). |
561
+ | linear | Removes the up/down arrows. Left/right arrows step through all slides (both horizontal and vertical). |
562
+ | grid | When this is enabled, stepping left/right from a vertical stack to an adjacent vertical stack will land you at the same vertical index.<br><br>Consider a deck with six slides ordered in two vertical stacks:<br>`1.1`&nbsp;&nbsp;&nbsp;&nbsp;`2.1`<br>`1.2`&nbsp;&nbsp;&nbsp;&nbsp;`2.2`<br>`1.3`&nbsp;&nbsp;&nbsp;&nbsp;`2.3`<br><br>If you're on slide 1.3 and navigate right, you will normally move from 1.3 -> 2.1. With navigationMode set to "grid" the same navigation takes you from 1.3 -> 2.3. |
563
+
459
564
  ### Touch Navigation
460
565
 
461
566
  You can swipe to navigate through a presentation on any touch-enabled device. Horizontal swipes change between horizontal slides, vertical swipes change between vertical slides. If you wish to disable this you can set the `touch` config option to false when initializing reveal.js.
@@ -466,7 +571,7 @@ If there's some part of your content that needs to remain accessible to touch ev
466
571
 
467
572
  When working on presentation with a lot of media or iframe content it's important to load lazily. Lazy loading means that reveal.js will only load content for the few slides nearest to the current slide. The number of slides that are preloaded is determined by the `viewDistance` configuration option.
468
573
 
469
- To enable lazy loading all you need to do is change your `src` attributes to `data-src` as shown below. This is supported for image, video, audio and iframe elements. Lazy loaded iframes will also unload when the containing slide is no longer visible.
574
+ To enable lazy loading all you need to do is change your `src` attributes to `data-src` as shown below. This is supported for image, video, audio and iframe elements.
470
575
 
471
576
  ```html
472
577
  <section>
@@ -479,6 +584,26 @@ To enable lazy loading all you need to do is change your `src` attributes to `da
479
584
  </section>
480
585
  ```
481
586
 
587
+ #### Lazy Loading Iframes
588
+
589
+ Note that lazy loaded iframes ignore the `viewDistance` configuration and will only load when their containing slide becomes visible. Iframes are also unloaded as soon as the slide is hidden.
590
+
591
+ When we lazy load a video or audio element, reveal.js won't start playing that content until the slide becomes visible. However there is no way to control this for an iframe since that could contain any kind of content. That means if we loaded an iframe before the slide is visible on screen it could begin playing media and sound in the background.
592
+
593
+ You can override this behavior with the `data-preload` attribute. The iframe below will be loaded
594
+ according to the `viewDistance`.
595
+
596
+ ```html
597
+ <section>
598
+ <iframe data-src="http://hakim.se" data-preload></iframe>
599
+ </section>
600
+ ```
601
+
602
+ You can also change the default globally with the `preloadIframes` configuration option. If set to
603
+ `true` ALL iframes with a `data-src` attribute will be preloaded when within the `viewDistance`
604
+ regardless of individual `data-preload` attributes. If set to `false`, all iframes will only be
605
+ loaded when they become visible.
606
+
482
607
  ### API
483
608
 
484
609
  The `Reveal` object exposes a JavaScript API for controlling navigation and reading state:
@@ -526,6 +651,15 @@ Reveal.getProgress(); // (0 == first slide, 1 == last slide)
526
651
  Reveal.getSlides(); // Array of all slides
527
652
  Reveal.getTotalSlides(); // Total number of slides
528
653
 
654
+ // Returns an array with all horizontal/vertical slides in the deck
655
+ Reveal.getHorizontalSlides();
656
+ Reveal.getVerticalSlides();
657
+
658
+ // Checks if the presentation contains two or more
659
+ // horizontal/vertical slides
660
+ Reveal.hasHorizontalSlides();
661
+ Reveal.hasVerticalSlides();
662
+
529
663
  // Returns the speaker notes for the current slide
530
664
  Reveal.getSlideNotes();
531
665
 
@@ -535,6 +669,9 @@ Reveal.isLastSlide();
535
669
  Reveal.isOverview();
536
670
  Reveal.isPaused();
537
671
  Reveal.isAutoSliding();
672
+
673
+ // Returns the top-level DOM element
674
+ Reveal.getRevealElement(); // <div class="reveal">...</div>
538
675
  ```
539
676
 
540
677
  ### Custom Key Bindings
@@ -672,6 +809,8 @@ Embeds a web page as a slide background that covers 100% of the reveal.js width
672
809
  </section>
673
810
  ```
674
811
 
812
+ Iframes are lazy-loaded when they become visible. If you'd like to preload iframes ahead of time, you can append a `data-preload` attribute to the slide `<section>`. You can also enable preloading globally for all iframes using the `preloadIframes` configuration option.
813
+
675
814
  #### Background Transitions
676
815
 
677
816
  Backgrounds transition using a fade animation by default. This can be changed to a linear sliding transition by passing `backgroundTransition: 'slide'` to the `Reveal.initialize()` call. Alternatively you can set `data-background-transition` on any section with a background to override that specific transition.
@@ -811,15 +950,15 @@ Reveal.addEventListener( 'fragmenthidden', function( event ) {
811
950
  } );
812
951
  ```
813
952
 
814
- ### Code syntax highlighting
953
+ ### Code Syntax Highlighting
815
954
 
816
- By default, Reveal is configured with [highlight.js](https://highlightjs.org/) for code syntax highlighting. To enable syntax highlighting, you'll have to load the highlight plugin ([plugin/highlight/highlight.js](plugin/highlight/highlight.js)) and a highlight.js CSS theme (Reveal comes packaged with the zenburn theme: [lib/css/zenburn.css](lib/css/zenburn.css)).
955
+ By default, Reveal is configured with [highlight.js](https://highlightjs.org/) for code syntax highlighting. To enable syntax highlighting, you'll have to load the highlight plugin ([plugin/highlight/highlight.js](plugin/highlight/highlight.js)) and a highlight.js CSS theme (Reveal comes packaged with the Monokai themes: [lib/css/monokai.css](lib/css/monokai.css)).
817
956
 
818
957
  ```javascript
819
958
  Reveal.initialize({
820
959
  // More info https://github.com/hakimel/reveal.js#dependencies
821
960
  dependencies: [
822
- { src: 'plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
961
+ { src: 'plugin/highlight/highlight.js', async: true },
823
962
  ]
824
963
  });
825
964
  ```
@@ -838,6 +977,37 @@ Below is an example with clojure code that will be syntax highlighted. When the
838
977
  </section>
839
978
  ```
840
979
 
980
+ #### Line Numbers & Highlights
981
+
982
+ To enable line numbers, add `data-line-numbers` to your `<code>` tags. If you want to highlight specific lines you can provide a comma separated list of line numbers using the same attribute. For example, in the following example lines 4 and 8-11 are highlighted:
983
+
984
+ ```html
985
+ <pre><code class="hljs" data-line-numbers="4,8-11">
986
+ import React, { useState } from 'react';
987
+
988
+ function Example() {
989
+ const [count, setCount] = useState(0);
990
+
991
+ return (
992
+ <div>
993
+ <p>You clicked {count} times</p>
994
+ <button onClick={() => setCount(count + 1)}>
995
+ Click me
996
+ </button>
997
+ </div>
998
+ );
999
+ }
1000
+ </code></pre>
1001
+ ```
1002
+
1003
+ <img width="300" alt="line-numbers" src="https://user-images.githubusercontent.com/629429/55332077-eb3c4780-5494-11e9-8854-ba33cd0fa740.png">
1004
+
1005
+ #### Step-by-step Highlights
1006
+
1007
+ You can step through multiple code highlights on the same code block. Delimit each of your highlight steps with the `|` character. For example `data-line-numbers="1|2-3|4,6-10"` will produce three steps. It will start by highlighting line 1, next step is lines 2-3, and finally line 4 and 6 through 10.
1008
+
1009
+
1010
+
841
1011
  ### Slide number
842
1012
 
843
1013
  If you would like to display the page number of the current slide you can do so using the `slideNumber` and `showSlideNumber` configuration values.
@@ -853,6 +1023,12 @@ Reveal.configure({ slideNumber: true });
853
1023
  // "c/t": flattened slide number / total slides
854
1024
  Reveal.configure({ slideNumber: 'c/t' });
855
1025
 
1026
+ // You can provide a function to fully customize the number:
1027
+ Reveal.configure({ slideNumber: function( slide ) {
1028
+ // Ignore numbering of vertical slides
1029
+ return [ Reveal.getIndices( slide ).h ];
1030
+ }});
1031
+
856
1032
  // Control which views the slide number displays on using the "showSlideNumber" value:
857
1033
  // "all": show on all views (default)
858
1034
  // "speaker": only show slide numbers on speaker notes view
@@ -908,6 +1084,16 @@ Limitations:
908
1084
  - Only direct descendants of a slide section can be stretched
909
1085
  - Only one descendant per slide section can be stretched
910
1086
 
1087
+ ### Resize Event
1088
+
1089
+ When reveal.js changes the scale of the slides it fires a resize event. You can subscribe to the event to resize your elements accordingly.
1090
+
1091
+ ```javascript
1092
+ Reveal.addEventListener( 'resize', function( event ) {
1093
+ // event.scale, event.oldScale, event.size
1094
+ } );
1095
+ ```
1096
+
911
1097
  ### postMessage API
912
1098
 
913
1099
  The framework has a built-in postMessage API that can be used when communicating with a presentation inside of another window. Here's an example showing how you'd make a reveal.js instance in the given window proceed to slide 2:
@@ -916,18 +1102,38 @@ The framework has a built-in postMessage API that can be used when communicating
916
1102
  <window>.postMessage( JSON.stringify({ method: 'slide', args: [ 2 ] }), '*' );
917
1103
  ```
918
1104
 
1105
+ #### postMessage Events
1106
+
919
1107
  When reveal.js runs inside of an iframe it can optionally bubble all of its events to the parent. Bubbled events are stringified JSON with three fields: namespace, eventName and state. Here's how you subscribe to them from the parent window:
920
1108
 
921
1109
  ```javascript
922
1110
  window.addEventListener( 'message', function( event ) {
923
1111
  var data = JSON.parse( event.data );
924
- if( data.namespace === 'reveal' && data.eventName ==='slidechanged' ) {
1112
+ if( data.namespace === 'reveal' && data.eventName === 'slidechanged' ) {
925
1113
  // Slide changed, see data.state for slide number
926
1114
  }
927
1115
  } );
928
1116
  ```
929
1117
 
930
- This cross-window messaging can be toggled on or off using configuration flags.
1118
+ #### postMessage Callbacks
1119
+
1120
+ When you call any method via the postMessage API, reveal.js will dispatch a message with the return value. This is done so that you can call a getter method and see what the result is. Check out this example:
1121
+
1122
+ ```javascript
1123
+ <revealWindow>.postMessage( JSON.stringify({ method: 'getTotalSlides' }), '*' );
1124
+
1125
+ window.addEventListener( 'message', function( event ) {
1126
+ var data = JSON.parse( event.data );
1127
+ // `data.method`` is the method that we invoked
1128
+ if( data.namespace === 'reveal' && data.eventName === 'callback' && data.method === 'getTotalSlides' ) {
1129
+ data.result // = the total number of slides
1130
+ }
1131
+ } );
1132
+ ```
1133
+
1134
+ #### Turning postMessage on/off
1135
+
1136
+ This cross-window messaging can be toggled on or off using configuration flags. These are the default values.
931
1137
 
932
1138
  ```javascript
933
1139
  Reveal.initialize({
@@ -944,7 +1150,7 @@ Reveal.initialize({
944
1150
 
945
1151
  ## PDF Export
946
1152
 
947
- Presentations can be exported to PDF via a special print stylesheet. This feature requires that you use [Google Chrome](http://google.com/chrome) or [Chromium](https://www.chromium.org/Home) and to be serving the presentation from a webserver.
1153
+ Presentations can be exported to PDF via a special print stylesheet. This feature requires that you use [Google Chrome](http://google.com/chrome) or [Chromium](https://www.chromium.org/Home) and to be serving the presentation from a web server.
948
1154
  Here's an example of an exported presentation that's been uploaded to SlideShare: http://www.slideshare.net/hakimel/revealjs-300.
949
1155
 
950
1156
  ### Separate pages for fragments
@@ -1049,7 +1255,7 @@ This will only display in the notes window.
1049
1255
 
1050
1256
  Notes are only visible to the speaker inside of the speaker view. If you wish to share your notes with others you can initialize reveal.js with the `showNotes` configuration value set to `true`. Notes will appear along the bottom of the presentations.
1051
1257
 
1052
- When `showNotes` is enabled notes are also included when you [export to PDF](https://github.com/hakimel/reveal.js#pdf-export). By default, notes are printed in a semi-transparent box on top of the slide. If you'd rather print them on a separate page after the slide, set `showNotes: "separate-page"`.
1258
+ When `showNotes` is enabled notes are also included when you [export to PDF](https://github.com/hakimel/reveal.js#pdf-export). By default, notes are printed in a box on top of the slide. If you'd rather print them on a separate page, after the slide, set `showNotes: "separate-page"`.
1053
1259
 
1054
1260
  #### Speaker notes clock and timers
1055
1261
 
@@ -1059,7 +1265,7 @@ The speaker notes window will also show:
1059
1265
  - Current wall-clock time
1060
1266
  - (Optionally) a pacing timer which indicates whether the current pace of the presentation is on track for the right timing (shown in green), and if not, whether the presenter should speed up (shown in red) or has the luxury of slowing down (blue).
1061
1267
 
1062
- The pacing timer can be enabled by configuring by the `defaultTiming` parameter in the `Reveal` configuration block, which specifies the number of seconds per slide. 120 can be a reasonable rule of thumb. Timings can also be given per slide `<section>` by setting the `data-timing` attribute. Both values are in numbers of seconds.
1268
+ The pacing timer can be enabled by configuring the `defaultTiming` parameter in the `Reveal` configuration block, which specifies the number of seconds per slide. 120 can be a reasonable rule of thumb. Alternatively, you can enable the timer by setting `totalTime`, which sets the total length of your presentation (also in seconds). If both values are specified, `totalTime` wins and `defaultTiming` is ignored. Regardless of the baseline timing method, timings can also be given per slide `<section>` by setting the `data-timing` attribute (again, in seconds).
1063
1269
 
1064
1270
 
1065
1271
  ## Server Side Speaker Notes
@@ -1079,11 +1285,33 @@ Reveal.initialize({
1079
1285
 
1080
1286
  Then:
1081
1287
 
1082
- 1. Install [Node.js](http://nodejs.org/) (4.0.0 or later)
1288
+ 1. Install [Node.js](http://nodejs.org/) (9.0.0 or later)
1083
1289
  2. Run `npm install`
1084
1290
  3. Run `node plugin/notes-server`
1085
1291
 
1086
1292
 
1293
+ ## Plugins
1294
+
1295
+ Plugins should register themselves with reveal.js by calling `Reveal.registerPlugin( 'myPluginID', MyPlugin )`. Registered plugin instances can optionally expose an "init" function that reveal.js will call to initialize them.
1296
+
1297
+ When reveal.js is booted up via `Reveal.initialize()`, it will go through all registered plugins and invoke their "init" methods. If the "init" method returns a Promise, reveal.js will wait for that promise to be fulfilled before finishing the startup sequence and firing the [ready](#ready-event) event. Here's an example of a plugin that does some asynchronous work before reveal.js can proceed:
1298
+
1299
+ ```javascript
1300
+ let MyPlugin = {
1301
+ init: () => new Promise( resolve => setTimeout( resolve, 3000 ) )
1302
+ };
1303
+ Reveal.registerPlugin( 'myPlugin', MyPlugin );
1304
+ Reveal.addEventListener( 'ready', () => console.log( 'Three seconds later...' ) );
1305
+ Reveal.initialize();
1306
+ ```
1307
+
1308
+ Note that reveal.js will *not* wait for init Promise fulfillment if the plugin is loaded as an [async dependency](#dependencies). If the plugin's init method does _not_ return a Promise, the plugin is considered ready right away and will not hold up the reveal.js startup sequence.
1309
+
1310
+ ### Retrieving Plugins
1311
+
1312
+ If you want to check if a specific plugin is registered you can use the `Reveal.hasPlugin` method and pass in a plugin ID, for example: `Reveal.hasPlugin( 'myPlugin' )`. If you want to retrieve a plugin instance you can use `Reveal.getPlugin( 'myPlugin' )`.
1313
+
1314
+
1087
1315
  ## Multiplexing
1088
1316
 
1089
1317
  The multiplex plugin allows your audience to view the slides of the presentation you are controlling on their own phone, tablet or laptop. As the master presentation navigates the slides, all client presentations will update in real time. See a demo at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/).
@@ -1120,7 +1348,7 @@ Reveal.initialize({
1120
1348
 
1121
1349
  // Don't forget to add the dependencies
1122
1350
  dependencies: [
1123
- { src: '//cdn.socket.io/socket.io-1.3.5.js', async: true },
1351
+ { src: '//cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js', async: true },
1124
1352
  { src: 'plugin/multiplex/master.js', async: true },
1125
1353
 
1126
1354
  // and if you want speaker notes
@@ -1133,7 +1361,7 @@ Reveal.initialize({
1133
1361
 
1134
1362
  #### Client presentation
1135
1363
 
1136
- Served from a publicly accessible static file server. Examples include: GitHub Pages, Amazon S3, Dreamhost, Akamai, etc. The more reliable, the better. Your audience can then access the client presentation via `http://example.com/path/to/presentation/client/index.html`, with the configuration below causing them to connect to the socket.io server as clients.
1364
+ Served from a publicly accessible static file server. Examples include: GitHub Pages, Amazon S3, Dreamhost, Akamai, etc. The more reliable, the better. Your audience can then access the client presentation via `https://example.com/path/to/presentation/client/index.html`, with the configuration below causing them to connect to the socket.io server as clients.
1137
1365
 
1138
1366
  Example configuration:
1139
1367
 
@@ -1150,7 +1378,7 @@ Reveal.initialize({
1150
1378
 
1151
1379
  // Don't forget to add the dependencies
1152
1380
  dependencies: [
1153
- { src: '//cdn.socket.io/socket.io-1.3.5.js', async: true },
1381
+ { src: '//cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js', async: true },
1154
1382
  { src: 'plugin/multiplex/client.js', async: true }
1155
1383
 
1156
1384
  // other dependencies...
@@ -1167,7 +1395,7 @@ Server that receives the `slideChanged` events from the master presentation and
1167
1395
 
1168
1396
  Or you can use the socket.io server at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/).
1169
1397
 
1170
- You'll need to generate a unique secret and token pair for your master and client presentations. To do so, visit `http://example.com/token`, where `http://example.com` is the location of your socket.io server. Or if you're going to use the socket.io server at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/), visit [https://reveal-js-multiplex-ccjbegmaii.now.sh/token](https://reveal-js-multiplex-ccjbegmaii.now.sh/token).
1398
+ You'll need to generate a unique secret and token pair for your master and client presentations. To do so, visit `https://example.com/token`, where `https://example.com` is the location of your socket.io server. Or if you're going to use the socket.io server at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/), visit [https://reveal-js-multiplex-ccjbegmaii.now.sh/token](https://reveal-js-multiplex-ccjbegmaii.now.sh/token).
1171
1399
 
1172
1400
  You are very welcome to point your presentations at the Socket.io server running at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/), but availability and stability are not guaranteed.
1173
1401
 
@@ -1192,7 +1420,7 @@ Reveal.initialize({
1192
1420
 
1193
1421
  // Don't forget to add the dependencies
1194
1422
  dependencies: [
1195
- { src: '//cdn.socket.io/socket.io-1.3.5.js', async: true },
1423
+ { src: '//cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js', async: true },
1196
1424
  { src: 'plugin/multiplex/client.js', async: true }
1197
1425
 
1198
1426
  // other dependencies...
@@ -1216,7 +1444,7 @@ Reveal.initialize({
1216
1444
 
1217
1445
  // Don't forget to add the dependencies
1218
1446
  dependencies: [
1219
- { src: '//cdn.socket.io/socket.io-1.3.5.js', async: true },
1447
+ { src: '//cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js', async: true },
1220
1448
  { src: 'plugin/multiplex/master.js', async: true },
1221
1449
  { src: 'plugin/multiplex/client.js', async: true }
1222
1450
 
@@ -1230,7 +1458,7 @@ Reveal.initialize({
1230
1458
 
1231
1459
  If you want to display math equations in your presentation you can easily do so by including this plugin. The plugin is a very thin wrapper around the [MathJax](http://www.mathjax.org/) library. To use it you'll need to include it as a reveal.js dependency, [find our more about dependencies here](#dependencies).
1232
1460
 
1233
- The plugin defaults to using [LaTeX](http://en.wikipedia.org/wiki/LaTeX) but that can be adjusted through the `math` configuration object. Note that MathJax is loaded from a remote server. If you want to use it offline you'll need to download a copy of the library and adjust the `mathjax` configuration value.
1461
+ The plugin defaults to using [LaTeX](https://en.wikipedia.org/wiki/LaTeX) but that can be adjusted through the `math` configuration object. Note that MathJax is loaded from a remote server. If you want to use it offline you'll need to download a copy of the library and adjust the `mathjax` configuration value.
1234
1462
 
1235
1463
  Below is an example of how the plugin can be configured. If you don't intend to change these values you do not need to include the `math` config object at all.
1236
1464
 
@@ -1240,7 +1468,9 @@ Reveal.initialize({
1240
1468
 
1241
1469
  math: {
1242
1470
  mathjax: 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js',
1243
- config: 'TeX-AMS_HTML-full' // See http://docs.mathjax.org/en/latest/config-files.html
1471
+ config: 'TeX-AMS_HTML-full', // See http://docs.mathjax.org/en/latest/config-files.html
1472
+ // pass other options into `MathJax.Hub.Config()`
1473
+ TeX: { Macros: { RR: "{\\bf R}" } }
1244
1474
  },
1245
1475
 
1246
1476
  dependencies: [
@@ -1251,59 +1481,15 @@ Reveal.initialize({
1251
1481
 
1252
1482
  Read MathJax's documentation if you need [HTTPS delivery](http://docs.mathjax.org/en/latest/start.html#secure-access-to-the-cdn) or serving of [specific versions](http://docs.mathjax.org/en/latest/configuration.html#loading-mathjax-from-the-cdn) for stability.
1253
1483
 
1484
+ #### MathJax in Markdown
1485
+ If you want to include math inside of a presentation written in Markdown you need to wrap the formula in backticks. This prevents syntax conflicts between LaTeX and Markdown. For example:
1254
1486
 
1255
- ## Installation
1256
-
1257
- The **basic setup** is for authoring presentations only. The **full setup** gives you access to all reveal.js features and plugins such as speaker notes as well as the development tasks needed to make changes to the source.
1258
-
1259
- ### Basic setup
1260
-
1261
- The core of reveal.js is very easy to install. You'll simply need to download a copy of this repository and open the index.html file directly in your browser.
1262
-
1263
- 1. Download the latest version of reveal.js from <https://github.com/hakimel/reveal.js/releases>
1264
- 2. Unzip and replace the example contents in index.html with your own
1265
- 3. Open index.html in a browser to view it
1266
-
1267
- ### Full setup
1268
-
1269
- Some reveal.js features, like external Markdown and speaker notes, require that presentations run from a local web server. The following instructions will set up such a server as well as all of the development tasks needed to make edits to the reveal.js source code.
1270
-
1271
- 1. Install [Node.js](http://nodejs.org/) (4.0.0 or later)
1272
-
1273
- 1. Clone the reveal.js repository
1274
- ```sh
1275
- $ git clone https://github.com/hakimel/reveal.js.git
1276
- ```
1277
-
1278
- 1. Navigate to the reveal.js folder
1279
- ```sh
1280
- $ cd reveal.js
1281
- ```
1282
-
1283
- 1. Install dependencies
1284
- ```sh
1285
- $ npm install
1286
- ```
1287
-
1288
- 1. Serve the presentation and monitor source files for changes
1289
- ```sh
1290
- $ npm start
1291
- ```
1292
-
1293
- 1. Open <http://localhost:8000> to view your presentation
1294
-
1295
- You can change the port by using `npm start -- --port=8001`.
1296
-
1297
- ### Folder Structure
1298
-
1299
- - **css/** Core styles without which the project does not function
1300
- - **js/** Like above but for JavaScript
1301
- - **plugin/** Components that have been developed as extensions to reveal.js
1302
- - **lib/** All other third party assets (JavaScript, CSS, fonts)
1303
-
1487
+ ```
1488
+ `$$ J(\theta_0,\theta_1) = \sum_{i=0} $$`
1489
+ ```
1304
1490
 
1305
1491
  ## License
1306
1492
 
1307
1493
  MIT licensed
1308
1494
 
1309
- Copyright (C) 2018 Hakim El Hattab, http://hakim.se
1495
+ Copyright (C) 2020 Hakim El Hattab, http://hakim.se