summaryrefslogtreecommitdiffstats
path: root/doc/backends/deckjs/example
diff options
context:
space:
mode:
authorYaroslav Brustinov <ybrustin@cisco.com>2016-11-07 10:36:10 +0200
committerYaroslav Brustinov <ybrustin@cisco.com>2016-11-07 10:36:10 +0200
commit93dc74335a8082e0f54b1da7f6fc6e43ff3c10ee (patch)
tree3befab98de04fdbb63807c6db1844028ae50d8b6 /doc/backends/deckjs/example
parentbdd1dea5e21a00b6af1b0ded09e7d528485d5196 (diff)
parent5925379b5fb30e548f1ba4e804af9865de8903ae (diff)
Add 'doc/' from commit '5925379b5fb30e548f1ba4e804af9865de8903ae'
git-subtree-dir: doc git-subtree-mainline: bdd1dea5e21a00b6af1b0ded09e7d528485d5196 git-subtree-split: 5925379b5fb30e548f1ba4e804af9865de8903ae
Diffstat (limited to 'doc/backends/deckjs/example')
-rw-r--r--doc/backends/deckjs/example/example-template.asciidoc54
-rw-r--r--doc/backends/deckjs/example/tutorial-slide.asciidoc274
2 files changed, 328 insertions, 0 deletions
diff --git a/doc/backends/deckjs/example/example-template.asciidoc b/doc/backends/deckjs/example/example-template.asciidoc
new file mode 100644
index 00000000..7875b2a1
--- /dev/null
+++ b/doc/backends/deckjs/example/example-template.asciidoc
@@ -0,0 +1,54 @@
+deck.js Support for Asciidoc
+=============================
+:author: Foo Bar
+:email: <foo@bar.org>
+:description: just a template file.
+:revdate: 2011-12-16
+:revnumber: 0.1
+///////////////////////
+ Themes that you can choose includes:
+ web-2.0, swiss, neon, beamer
+///////////////////////
+:deckjs_theme: web-2.0
+///////////////////////
+ Transitions that you can choose includes:
+ fade, horizontal-slide, vertical-slide
+///////////////////////
+:deckjs_transition: horizontal-slide
+///////////////////////
+ AsciiDoc use `source-highlight` as default highlighter.
+
+ Styles available for pygment highlighter:
+ monokai, manni, perldoc, borland, colorful, default, murphy, vs, trac,
+ tango, fruity, autumn, bw, emacs, vim, pastie, friendly, native,
+
+ Uncomment following two lines if you want to highlight your code
+ with `Pygments`.
+///////////////////////
+//:pygments:
+//:pygments_style: native
+///////////////////////
+ Uncomment following line if you want to scroll inside slides
+ with {down,up} arrow keys.
+///////////////////////
+//:scrollable:
+///////////////////////
+ Uncomment following line if you want to link css and js file
+ from outside instead of embedding them into the output file.
+///////////////////////
+//:linkcss:
+///////////////////////
+ Uncomment following line if you want to count each incremental
+ bullet as a new slide
+///////////////////////
+//:count_nested:
+
+== Slide One
+
+[incremental="true"]
+ * item 1
+ * item 2
+
+== Slide Two
+
+That's all.
diff --git a/doc/backends/deckjs/example/tutorial-slide.asciidoc b/doc/backends/deckjs/example/tutorial-slide.asciidoc
new file mode 100644
index 00000000..da317db2
--- /dev/null
+++ b/doc/backends/deckjs/example/tutorial-slide.asciidoc
@@ -0,0 +1,274 @@
+deck.js Support for Asciidoc
+=============================
+:author: Qingping Hou
+:email: <dave2008713@gmail.com>
+:description: a tutorial for writing deck.js presentation with asciidoc
+:revdate: 2014-06-30
+:revnumber: 0.9
+:deckjs_theme: neon
+:deckjs_transition: horizontal-slide
+:pygments:
+:pygments_style: native
+:scrollable:
+
+
+== What is deck.js?
+
+*deck.js* is a JavaScript library for building modern HTML presentations. *deck.js* is flexible enough to let advanced CSS and JavaScript authors craft highly customized decks, but also provides templates and themes for the HTML novice to build a standard slideshow.
+
+
+For more information, please check out its http://imakewebthings.github.com/deck.js/[project page].
+
+
+== What is deck.js backend for Asciidoc?
+
+*AsciiDoc-Deck.js* makes it possible to write deck.js slides in my favorite markup language *AsciiDoc*. To make life easier, I also bundled this backend with some thirdparty deck.js extensions:
+
+* https://github.com/barraq/deck.ext.js[deck.ext.js]
+* https://github.com/mikek70/deck.js-blank[deck.js-blank]
+* https://github.com/houqp/deck.split.js[deck.split.js]
+
+
+== How to generate deck.js with Asciidoc
+
+First, make sure you have at least asciidoc-8.6.6 installed and download this backend from the http://houqp.github.com/asciidoc-deckjs/[project page].
+
+Then install the backend:
+
+...........................................
+asciidoc --backend install deckjs-X.Y.Z.zip
+...........................................
+
+After the installation, it's just as simple as issuing following command:
+
+...........................................
+asciidoc -b deckjs file.asciidoc
+...........................................
+
+You can also use this backend without installation, please refer to https://github.com/houqp/asciidoc-deckjs/blob/master/README.md[README] for details.
+
+
+== Shortcuts
+
+Following are built-in shortcuts in deck.js:
+
+* jump to any slide by given number, `g`.
+* preview all slides, `m`.
+
+Shortcuts from deck.js's thirdparty extensions:
+
+* toggle table of content, `t`
+* toggle page blank/unblank, `b`
+
+
+== Syntax (basic)
+
+This part assumes that you are already familiar with some basic concepts in AsciiDoc.
+
+* slides are divided by *level 1* sections.
+...........................................
+== Slide1 title
+
+say whatever you want here.
+...........................................
+
+ifdef::backend-deckjs[<<<]
+
+* lists
+
+...........................................
+* entry1
+* entry2
+* entry3
+...........................................
+
+* ordered list
+
+...........................................
+1. entry1
+1. entry2
+1. entry3
+...........................................
+
+A complete guide for lists can be found at http://www.methods.co.nz/asciidoc/userguide.html#X64[this page]
+
+
+== Syntax (theming)
+
+You can choose theme and transition effect by specifying the *deckjs-theme* and *deckjs-transition* attributes:
+
+...........................................
+:deckjs_theme: neon
+:deckjs_transition: vertical-slide
+...........................................
+
+Refer to http://houqp.github.com/asciidoc-deckjs/example-template.asciidoc[boilerplate] for all the supported themes.
+
+
+== Syntax (nested slide)
+
+Nested slide (or subslide) give you the ability to create substeps in slides. In this backend, elements that given *incremental* attribute will be paused before show up.
+
+syntax:
+
+...........................................
+[incremental="true"]
+* this entry should show up first
+* this entry should show up following the first one
+* this entry should be the last one
+...........................................
+
+effect:
+
+[incremental="true"]
+* this entry should show up first
+* this entry should show up following the first one
+* this entry should be the last one
+
+
+== Syntax (literal block)
+syntax:
+
+ ...........................................
+ <html>
+ <head>
+ </head>
+ <body>
+ <p>Hello World.</p>
+ </body>
+ </html>
+ ...........................................
+
+effect:
+
+[incremental="true"]
+...........................................
+<html>
+ <head>
+ </head>
+ <body>
+ <p>Hello World.</p>
+ </body>
+</html>
+...........................................
+
+
+== Syntax (code block)
+
+syntax:
+
+...........................................
+[source,c,numbered]
+-------------------------------------------
+int swallow_redpill () {
+ unsigned char m[2+4], rpill[] = "\x0f\x01\x0d\x00\x00\x00\x00\xc3";
+ *((unsigned*)&rpill[3]) = (unsigned)m;
+ ((void(*)())&rpill)();
+ return (m[5]>0xd0) ? 1 : 0;
+}
+-------------------------------------------
+...........................................
+
+effect:
+
+[incremental="true"]
+[source,c,numbered]
+-------------------------------------------
+int swallow_redpill () {
+ unsigned char m[2+4], rpill[] = "\x0f\x01\x0d\x00\x00\x00\x00\xc3";
+ *((unsigned*)&rpill[3]) = (unsigned)m;
+ ((void(*)())&rpill)();
+ return (m[5]>0xd0) ? 1 : 0;
+}
+-------------------------------------------
+
+By default, AsciiDoc use *source-highlight* to highlight your code. If you want to use *Pygments*, you have to set _pygments_ attribute (refer to example template).
+
+
+== Syntax (quote block)
+QuoteBlocks syntax from Asciidoc is fully supported, you can find complete guide on http://www.methods.co.nz/asciidoc/userguide.html#_quote_blocks[this page].
+
+syntax:
+
+...........................................
+ [quote, L. Kronecker]
+ ___________________________________________
+ God made the natural number and all the rest is the work of man
+ ___________________________________________
+...........................................
+
+effect:
+
+[incremental="true"]
+[quote, L. Kronecker]
+___________________________________________
+God made the natural number and all the rest is the work of man
+___________________________________________
+
+
+
+== Syntax (split slide)
+If your slide is too long, you can manually split it into multiple slides.
+
+syntax:
+
+...........................................
+ This line will be shown in current slide.
+
+ ifdef::backend-deckjs[<<<]
+
+ This line will be shown in next slide with the same title.
+...........................................
+
+effect:
+
+This line will be shown in current slide.
+
+ifdef::backend-deckjs[<<<]
+
+This line will be shown in next slide with the same title.
+
+
+== Syntax (insert image)
+
+syntax:
+
+...........................................
+image::http://www.gnu.org/graphics/gnu-head-sm.jpg[title="Texinfo"]
+...........................................
+
+effect:
+
+[incremental="true"]
+image::http://www.gnu.org/graphics/gnu-head-sm.jpg[title="Levitating GNU"]
+
+
+== Syntax (insert video)
+
+syntax:
+
+...........................................
+video::http://www.youtube.com/embed/GP3zvc2dG5Y[width="420", height="315"]
+...........................................
+
+effect:
+
+[incremental="true"]
+video::http://www.youtube.com/embed/GP3zvc2dG5Y[width="420", height="315"]
+
+
+== The End
+
+The source code for this slide can be found here:
+
+http://houqp.github.com/asciidoc-deckjs/tutorial-slide.asciidoc
+
+You can get start with following template:
+
+http://houqp.github.com/asciidoc-deckjs/example-template.asciidoc
+
+
+That's all. Hope you enjoy this backend. :-)
+
+
+