MindSlide – Not supported yet – How To



MindSlide – Not supported yet – How To

10 21


mindslide

View Freeplane mindmap as an HTML presentation (aka freemind to powerpoint slideshow)

On Github berteh / mindslide

MindSlide

  • View your Mindmap as an HTML presentation / slideshow
  • hit <space> to navigate

  • source code (on github) - donate  (on donorbox)

Table of Content

What is MindSlide?

Features

  • MindSlide currently supports
  • speaker notes (from the node notes) hit "s"

  • 2D overview (hit "esc" or "o") and easy navigation (space, arrows, click, touch) help (?)

  • simple & rich-text nodes, including code highlight:

    @page:right { margin: 1cm 2cm 1.3cm 4cm; }
    
  • links, images, icons and nodes connectors
  • gestures, markdown contents, PDF export, JavaScript API and more.

  • hidding mindmap nodes from slides
  • Recent improvements

The presenter notes are displayed in the presenter view.

The current slide aggregates all notes of the nodes it contains, but for the nodes that have children.

  • Rich text works in notes too!

Images support is only partial as it depends on the browser to find them, usually relative adress in a sub-directory is fine.

Help in improving this part is highly welcome.

Nodes connectors display with a cute "tilde character", any better idea is welcome (a small preview of the target slide on hover would be great, for instance)

Recent improvements

  • Mindslide now shows nodes icons
  • The last update of Reveal.js now allows for

    • more stunning transitions, including fade, slide, convex, concave, zoom.
    • parallax background (see demo)
    • slides shuffling
    • auto advancing slides (see documentation)

How To

  • Some help and instructions
  • Requirements
  • Install MindSlide
  • Use MindSlide
  • Configure MindSlide
  • Contribute / Contact

Requirements

Install MindSlide

  • To install MindSlide takes about 2 minutes:
  • Install from the archives:

  • dowload and unpack mindslide's master.zip into "mindslide" directory (or pick any name you like)
  • download and unpack reveal.js's master.zip into mindslide/reveal.js directory
  • download and unpack FontAwesome's master.zip into mindslide/Font-Awesome directory
  • (alternatively) you can also clone the source code:

    git clone --recursive https://github.com/berteh/mindslide.git
    
  • then copy mindslide/mindslide.xsl, mindslide/config.xml and mindslide/reveal-configuration.xsl into your freeplane/resources/xslt directory

Use MindSlide

  • Easy as pie:
  • launch freemind, edit your mindmap to your liking.
  • select file > export > Animation MindSlide (.html) to export your mindmap

  • save the HTML presentation in your mindslide directory! (or edit settings in config.xml to use the online CDN hosts for both reveal and font awesome)

  • Hide Nodes
  • View Speakers Notes

Hide Nodes

  • Great functionaliy for creating content in Freeplane, and presenting only when it's ready.
  • To hide a node from your mindslides simply add the attribute "slide-hide" to it:

          right-click > edit attribute in-line > add or select "slide-hide"

The original mindmap has more content in this node... but it does not show in your slides (nor do their respective speakers notes).

Great for preparing content in Freeplane, and presenting every part only when it's ready.

View Speakers Notes

  • Including preview of the next slide, notes for current slide, and timer.
  • Speaker notes require the presentation be served by a webserver, they don't work from a local file.

    You can use a very simple webserver such as mongoose that simply needs to be downloaded in mindslide directory and executed (clicked)... or execute the following line in mindslide directory if you have python installed:

    python -m SimpleHTTPServer 8080
    

    then browse to http://localhost:8080

Configure MindSlide

  • Many options are available
  • edit the config.xml in your freeplane/xslt directory (or the exported .html presentation file) for your prefered theme, transition, extra behaviour or functionality.
  • developpers may load extra librairies by editing reveal-configuration.xsl in freeplane/xslt too.
  • see reveal.js configuration

 

Contribute / Contact

Improve the code

  • Fork the code on github
  • Create your feature branch:
    git checkout -b name-of-your-feature
    
  • Commit your changes:
    git commit -am 'name and explain your feature'
    
  • Push to the branch:
    git push origin name-of-your-feature
    
  • Create a new Pull Request

Not supported yet

  • Many elements are still not supported. We welcome any pointers how to best do it, as well as help to do so!
  • node and edge style, clouds
  • free "post-it" nodes are not marked differently from other nodes
  • node attributes, zoom on images, author informations
  • packaging presentation with all its dependencies in a single portable file.
  • Put your suggestions on our "issues" list!
  • Known Bugs
  • summary node

  • summary node
  • summary node

Known Bugs

  • Various things we should fix, any pointer how to do so is welcome.
  • improve styles, fonts and general support of richtext content, as for now some elements don't show or not nicely

  • nodes with only an image show as empty list item.
  • Report your bugs on our "issues" list!

not showing nicely: font size changed in rich-text editor ar usually displayed too small. current workaround is to edit html code view to use relative size (small, tiny) instead of absolute size (4, 5)...

nodes containing but an image should not show as empty item. current workaround is to only add images on nodes that have some text.

Acknowledgments

  • This export tool relies on the fantastic Reveal.js HTML presentation framework, and Freeplane mind mapping tool. It uses beautiful icons from Font Awesome.

    If this feature helps you saving valuable time kindly consider a donation  to help keeping it alive

The End

Thank You!

Yours Respectfully

Powered by Mindslide for Freeplane, using Reveal.js

MindSlide View your Mindmap as an HTML presentation / slideshow hit <space> to navigate source code (on github) - donate  (on donorbox)