Tag: org-reveal

Displaying animated diagrams in org-reveal slide decks with SVG

org-reveal can be used to author slide decks with org-mode. The slides are displayed as an HTML document animated with reveal.js.

reveal.js allows to progressively display fragments which reveal parts of a page, for instance a bullet list.

It is also possible to display animated diagrams, as reveal.js fragments, provided that such diagrams are made as embedded SVG images included in the HTML.

Adding class="fragment" (and variations, including the associated data-fragment-index attributes) to the SVG elements helps animate parts of the diagram with the same JS actions as for regular bullet fragments.

The trick is to embed the SVG diagram inside the HTML source using the following code in the org-mode source:

#+BEGIN_EXPORT html
<svg ...>  
    ...
</svg>  
#+END_EXPORT

I’ve found inspiration for that trick seeing the way SVG content was animated in the following demo.

So far, I’ve edited my diagrams with inkscape, and finally copied the whole <svg> tag from the saved inkscape file, into the #+BEGIN_EXPORT embedded HTML of the org file.

You can see a demo of such an animation in the https://olberger.gitlab.io/org-teaching/slides.html document (slide 26: “Fragmented SVG display”).

Hope this helps.

Added docker container to my org-teaching framework to ease org-mode exports

I’ve improved a bit the org-teaching framework in order to prepare for the next edition of the CSC4101 classes.

I’ve now added a docker container which is in charge of performing the HTML or PDF exports of the slides (using org-reveal) or handbooks (using LaTeX).

Emacs and org-mode are still advised for editing contents, but having this container in the loop ensures that colleagues are able to preview the changes to the teaching material, and I’m no longer a bottleneck for generating the handouts. This also allows to export in a reproducible way, which doesn’t depend on my Emacs config tweaks.

I’ve also added Gitlab pages to the project’s CI so that the docs are updated live at https://olberger.gitlab.io/org-teaching/.

It’s probably not yet rady for use by anyone else, but I’d be glad to get feedback 😉

Using org-mode and org-reveal for teaching material

I’ve finally put together in a single example repo an example of the way I manage teaching material with org-mode.

It needs more docs and work, but should be usable. Docs and demo at http://www-public.tem-tsp.eu/~berger_o/org-teaching/ and the Gitlab repo at https://gitlab.com/olberger/org-teaching for those curious.

It doesn’t intend to be a full-fleshed product (also the name is just a codename), but release early, release often, they said 😉

Of course, teaching requires much more stuff than slides and handbooks, but eh, that’s my contribution for the moment.

Update 2017/05/18: I’ve updated the docs and repo to include generation of a “printed slides deck” in PDF, using DeckTape.