diff --git a/Readme.html b/Readme.html deleted file mode 100755 index 4167e34..0000000 --- a/Readme.html +++ /dev/null @@ -1,536 +0,0 @@ - - - -(Introduction to Org-Reveal) - - - - -
-
-
-

Introduction to Org-Reveal

-

Yujie Wen

-

yjwen.ty@gmail.com

-

-
- -
- -
- -

1 Reveal.js and Org-Reveal

-
-
    -
  • Reveal.js is a tool for creating good-looking HTML presentations, -authored by Hakim El Hattab.
    - For an example of reveal.js presentation, click here. -
    • -
  • Org-Reveal exports your Org documents to reveal.js -presentations.
    - With Org-reveal, you can create beautiful presentations with 3D -effects from simple but powerful Org contents. -
    • -
-
-
-
- -

2 Requirements and Installation

-
-
    -
  • Reveal.js. -
    • -
  • Latest org-mode. -
    • -
  • ox-reveal.el. -
    • -
  • And, of course, emacs. -
    • -
-
- -
-
-
- -

2.1 Obtain Reveal.js

-
-

-Download Reveal.js packages from here. -

- -

-Extract Reveal.js folders from the downloaded zip file. -

-
-
-
-
-
- -

2.2 Obtain org-mode

-
-

-Note: Org-reveal relies on the Org-mode 8.0 export frame work. -Pre-packaged org-mode may be out-of-date. -

- -

-If not sure, use the freshest development codes from git repository. -

-
- -
$ git clone git://orgmode.org/org-mode.git
-
-
- -

-Follow the online instruction to build and install Org-mode. -

-
-
-
-
-
- -

2.3 Obtain Org-reveal

-
-

-Download latest Org-reveal package from the Org-reveal GitHub page. -

- -

-Or clone the GitHub repository: -

-
- -
$ git clone https://github.com/yjwen/org-reveal.git
-
-
- -

-Copy ox-reveal.el to the Org-mode installation directory. -

- -

-Add the following statement to your .emacs file. -

-
- -
(require 'ox-reveal)
-
-
-
-
-
-
- -

3 Configuration

-
-
-
-
- -

3.1 Set the location of Reveal.js

-
-

-Org-reveal must know where Reveal.js is on your computer before -exporting Org contents. -

- -

-The default location is ./reveal.js, relative to the Org file. -

- -

-Change variable org-reveal-root 's value will change the location -globally. For example, add the following statement to your .emacs -file: -

-
- -
(setq org-reveal-root "d:/reveal.js")
-
-
- -

-By setting option REVEAL_ROOT, the location is only affected -within the Org file. -

- -
- -
#+REVEAL_ROOT: d:/reveal.js
-
-
-
-
-
-
-
- -

3.2 First Try

-
-

-To wake-up Org-reveal now, type "M-x load-library", then type -"ox-reveal". -

- -

-Now you can export this manual into Reveal.js presentation by -typing "C-c C-e R R". -

- -

-Open the generated "Readme.html" in your browser and enjoy the -cool slides. -

-
-
-
-
-
- -

3.3 The HLevel

-
-

-Org-reveal maps each heading and its contents to one Reveal.js -slides. Since Reveal.js arranges slides into a 2-dimentional matrix, -Org-reveal use a HLevel value to decide map headings to hozirontal -or vertical slides. -

- -
    -
  • Headings of level less or equal to HLevel are mapped to hozirontal -slides. -
    • -
  • Headings of deeper levels are mapped to vertical slides. -
    • -
- -

-HLevel's default value is 1, means only level 1 headings are arranged -horizontally, deeper headings are mapped to vertical slides below its -parent level 1 heading. -

-
- -
-
- -

3.3.1 HLevel's Affects on Slides Layout

-
-

-Assume we have a simple Org file as below: -

-
- -
* H1
-* H2
-** H2.1
-*** H2.1.1
-* H3
-
-
- -

-If HLevel is 1, the default value, headings H2.1 and H2.1.1 will -be mapping to vertical slides below the slides of heading H2. -

- - -
-

hlevel.png

-
- -

-If HLevel is changed to 2, slide of heading H2.1 will be changed -to the main hozirontal queue, and slide of heading H2.1.1 will be -a vertical slide below it. -

- - -
-

hlevel2.png

-
-
-
-
- -

3.3.2 Configure HLevel's Value

-
-
    -
  • Change variable org-reveal-hlevel's value to set HLevel globally.
    - For example, add the following statement to your .emacs file. -
    • -
-
- -
(setq org-reveal-hlevel 2)
-
-
- -
    -
  • Setting Org files local HLevel to option REVEAL_HLEVEL. -
    • -
-
- -
#+REVEAL_HLEVEL 2
-
-
-
-
-
-
-
- -

3.4 Select Theme and Transition

-
-

-Themes and transition styles are set globally throughout the whole -file by setting options REVEAL_THEME and REVEAL_TRANS. -

- -

-For an example, please check the heading part of this document. -

- -

-Available themes can be found in "css/theme/" in the reveal.js directory. -

- -

-Available transitions are: default|cube|page|concave|zoom|linear|fade|none. -

-
-
-
-
-
- -

3.5 Fragmented Contents

-
-

-Make contents fragmented (show up one-by-one) by setting option ATTR_REVEAL with -property ":frag frag-style", as illustrated below. -

- -

-Paragraphs can be fragmented. -

- -

-Items can be fragmented, too. -

- -

-Availabe fragment styles are: -

-
    -
  • grow -
    • -
-
    -
  • shrink -
    • -
-
    -
  • roll-in -
    • -
-
    -
  • fade-out -
    • -
-
    -
  • highlight-red -
    • -
-
    -
  • highlight-green -
    • -
-
    -
  • highlight-blue -
    • -
-
-
-
-
-
- -

3.6 Data State

-
- -

-Set property reveal_data_state to headings to change this slide's -display style, as illustrated above. -

- -

-Availabe data states are: alert|blackout|soothe. -

-
-
-
-
-
- -

3.7 Plug-ins

-
-

-Reveal.js provides several plug-in functions. -

- -
    -
  • reveal-control : Show/hide browsing control pad. -
    • -
  • reveal-progress : Show/hide progress bar. -
    • -
  • reveal-history : Enable/disable slide history track. -
    • -
  • reveal-center : Enable/disable slide centering. -
    • -
-
- -
-
- -

3.7.1 Configure Plug-ins

-
-

-Each plug-ins can be set on/off by adding #+OPTIONS tags or -settinng custom variables. -

- -
    -
  • #+OPTIONS tags:
    - reveal_control, reveal_progress, reveal_history, - reveal_center -
    • -
  • Custom variables:
    - org-reveal-control, org-reveal-progress, - org-reveal-history, org-reveal-center -
    • -
- -

-For an example, please refer to the heading part of this document. -

-
-
-
-
-
- -

3.8 Source Codes

-
-

-Org-reveal use Org-Babel to highlight source codes. -

- -

-Codes copied from Haskell Wiki. -

-
- -
fibs = 0 : 1 : next fibs
-       where next (a : t@(b:_)) = (a+b) : next t
-
-
- -

-If you saw odd indentation, please set variable org-html-indent -to nil and export again. -

-
-
-
-
- -

4 Thanks

-
-

-Courtesy to: -

- -

-the powerfull Org-mode, -

-

-and the impressive Reveal.js -

-
-
-
-
- - - - - diff --git a/Readme.html~ b/Readme.html~ deleted file mode 100755 index df95263..0000000 --- a/Readme.html~ +++ /dev/null @@ -1,590 +0,0 @@ - - - - -Introduction to Org-Reveal - - - - - - - -
-

Introduction to Org-Reveal

-
-

Table of Contents

-
- -
-
- -
-

1 Reveal.js and Org-Reveal

-
-
    -
  • Reveal.js is a tool for creating good look HTML presentations, -authored by Hakim El Hattab.
    - For an example of reveal.js presentation, click here. -
    • -
  • Org-Reveal exports your Org documents to reveal.js -presentations.
    - So you can create beautiful presentations with 3D effects from -simple but powerful org contents. -
    • -
-
-
-
-

2 Requirements and Installation

-
-
    -
  • Reveal.js. -
    • -
  • Latest org-mode. -
    • -
  • ox-reveal.el. -
    • -
  • And, of course, emacs. -
    • -
-
- -
-

2.1 Obtain Reveal.js

-
-

-Download Reveal.js packages from here. -

- -

-Extract reveal.js folders from the downloaded zip file. -

-
-
-
-

2.2 Obtain org-mode

-
-

-Note: Org-reveal relies on the LATEST org-mode export frame work. -Pre-packaged org-mode may be out-of-date. -

- -

-If not sure, use the freshest development codes from git repository. -

-
- -
$ git clone git://orgmode.org/org-mode.git
-
-
- -

-Follow the online instruction to build and install Org-mode. -

-
-
-
-

2.3 Obtain Org-reveal

-
-

-Download latest Org-reveal package from the Org-reveal GitHub page. -

- -

-Or clone the GitHub repository: -

-
- -
$ git clone https://github.com/yjwen/org-reveal.git
-
-
- -

-Copy ox-reveal.el to the Org-mode install directory. -

- -

-Add the following statement to your .emacs file. -

-
- -
(require 'ox-reveal)
-
-
-
-
-
-
-

3 Configuration

-
-
-

3.1 Set the location of Reveal.js

-
-

-Org-reveal must know where reveal.js is before exporting Org -contents. -

- -

-Default location is ./reveal.js, relative to the Org file. -

- -

-Change variable org-reveal-root 's value will change the location -globally. For example, add the following statement to your .emacs -file: -

-
- -
(setq org-reveal-root "d:/reveal.js")
-
-
- -

-By setting option REVEAL_ROOT, the location is only affected -within the Org file. -

- -
- -
#+REVEAL_ROOT: d:/reveal.js
-
-
-
-
-
-

3.2 First Try

-
-

-Modifications to .emacs will take effect at next time Emacs -starts up. -

- -

-To wake-up Org-reveal now, type "M-x load-library", then type -"ox-reveal". -

- -

-Now you can export this manual into Reveal.js presentation by -typing "C-c C-e R R". -

- -

-Open the generated "Readme.html" in your browser and enjoy the -cool slides. -

-
-
-
-

3.3 The HLevel

-
-

-Org-reveal maps each heading and its contents to one Reveal.js -slides. Since Reveal.js arrange slides into a 2-dimentional matrix, -Org-reveal use HLevel value to decide map headings to hozirontal -or vertical slides. -

- -
    -
  • Headings of level less or equal to HLevel are mapped to hozirontal -slides. -
    • -
  • Headings of deeper levels are mapped to vertical slides. -
    • -
- -

-HLevel's default value is 1, means only level 1 headings are arranged -horizontally, deeper headings are mapped to vertical slides below its -parent level 1 heading. -

-
- -
-

3.3.1 HLevel's Affects on Slides Layout

-
-

-Assume we have a simple Org file as below: -

-
- -
* H1
-* H2
-** H2.1
-*** H2.1.1
-* H3
-
-
- -

-If HLevel is 1, the default value, headings H2.1 and H2.1.1 will -be mapping to vertical slides below the slides of heading H2. -

- - -
-

hlevel.png

-
- -

-If HLevel is changed to 2, slide of heading H2.1 will be changed -to the main hozirontal queue, and slide of heading H2.1.1 will be -a vertical slide below it. -

- - -
-

hlevel2.png

-
-
-
-
-

3.3.2 Configure HLevel's Value

-
-
    -
  • Change variable org-reveal-hlevel's value to set HLevel globally.
    - For example, add the following statement to your .emacs file. -
    • -
-
- -
(setq org-reveal-hlevel 2)
-
-
- -
    -
  • Setting Org files local HLevel to option REVEAL_HLEVEL. -
    • -
-
- -
#+REVEAL_HLEVEL 2
-
-
-
-
-
-
-

3.4 Select Theme and Transition

-
-

-Themes and transitions are set globally throughout the whole file by -setting options REVEAL_THEME and REVEAL_TRANS. -

- -

-For example, check the heading parting of this documents. -

- -

-Available themes can be find in "css/theme/" in the reveal.js directory. -

- -

-Available transitions are: default|cube|page|concave|zoom|linear|fade|none. -

-
-
-
-

3.5 Fragmented Contents

-
-

-Make contents fragmented, show up one-by-one, by setting option ATTR_REVEAL with -property ":frag frag-style", as illustrated below. -

- -

-Paragraphs can be fragmented. -

- -

-Items can be fragmented, too. -

- -

-Availabe fragment styles are: -

-
    -
  • grow -
    • -
-
    -
  • shrink -
    • -
-
    -
  • roll-in -
    • -
-
    -
  • fade-out -
    • -
-
    -
  • highlight-red -
    • -
-
    -
  • highlight-green -
    • -
-
    -
  • highlight-blue -
    • -
-
-
-
-

3.6 Data State

-
- -

-Set property reveal_data_state to headings to change this slide's -style, as illustrated above. -

-
-
-
-

3.7 Plug-ins

-
-

-Reveal.js provides several plug-in functions. -

- -
    -
  • reveal-control : Show/hide browse control pad. -
    • -
  • reveal-progress : Show/hide progress bar. -
    • -
  • reveal-history : Enable/disable slide history track. -
    • -
  • reveal-center : Enable/disable slide centering. -
    • -
-
- -
-

3.7.1 Configure Plug-ins

-
-

-Each plug-ins can be set on/off by adding #+OPTIONS tags or -settinng custom variables. -

- -
    -
  • #+OPTIONS tags:
    - reveal_control, reveal_progress, reveal_history, - reveal_center -
    • -
  • Custom variables:
    - org-reveal-control, org-reveal-progress, - org-reveal-history, org-reveal-center -
    • -
-
-
-
-
-

3.8 Source Codes

-
-

-Org-reveal use Org-Babel to highlight source codes. -

- -

-Codes copied from Haskell Wiki. -

-
- -
fibs = 0 : 1 : next fibs
-       where next (a : t@(b:_)) = (a+b) : next t
-
-
- -

-If you saw odd indentation, please set variable org-html-indent -to nil and export again. -

-
-
-
-
-

4 Thanks

-
-

-Courtesy to: -

- -

-the powerfull Org-mode, -

-

-and the impressive Reveal.js -

-
-
-
-
-

Author: Yujie Wen

-

Created: 2013-04-28 Sun 15:31

-

Generated by Org mode 8.0-pre in Emacs 24.2.1.

-

Validate XHTML 1.0

-
- -