SliNKi v3

3rd Generation HTML5 Slides

Overview

• SliNKi is an HTML5 presentation application
• The combination of:
  • NetKernel's wiki resource model and its existing collection of macros
  • reveal.js HTML5 slides template

These slides are a single wiki page powered by...

• WiNK a NetKernel Wiki Application
• WiNK lets you use resource oriented macros
• Which means SliNKi "just works" here.

3rd Generation

• This is the 3rd generation featuring a new slide engine (reveal.js) and a completely clean bootstrap.
• It now allows other HTML5 libraries to be used at the same time.
• We're using Font-Awesome and Bootstrap in this slide set.

What Else is New?

Example

Here's an example of the wiki syntax

{slide}
===Instance of Example Page===
*Bullet 1
*Bullet 2

Mary had a little lamb.
{/slide}

{slide} is the macro that delimits a slide.

The following slide is the rendering of the wiki shown above...

Instance of Example Page

• Bullet 1
• Bullet 2

Mary had a little lamb.

Presentations

• Each {slide}...{/slide} block defines a different slide
• You add as many slides as you need for your presentation
• The content is all just wiki text
• So its very fast and very easy to create presentations

• SliNKi is Resource Oriented - so you can easily include other resources. This means its very easy to create slide libraries and save lots of time.
• Its even easy to have dynamically generated slides.

Booting

To boot to SliNKi inside WiNK (or within NetKernel docs) you use the {slinki} macro at the top of your page...

{slinki}
{
	//Options go here as a JSON array (see reference)
}
{/slinki}

This dynamically transforms the page into a presentation.

If you remove the {slinki} macro your page just looks like a regular wiki page (which can be handy as a basic high-level preview mode)

Macro Engines

SliNKi is just one macro provided as part of NetKernel's Wiki Resource Model. So its simple to extend with your own macro engines.

Some of the built-in macro engines include:

Example: Source Code Highlighting

Use the {java} source code tag

//Actually Javascript but its source code...
var data = pv.range(0, 10, .1).map(function(x)
{
    return {x: x, y: Math.sin(x) + Math.random() * .5 + 2};
  }
 );
 

Or use highlight.js

Use tags {html}<pre><code>...</code></pre>{/html}

//Javascript source code...
var data = pv.range(0, 10, .1).map(function(x)
{
	return {x: x, y: Math.sin(x) + Math.random() * .5 + 2};
}
);

SliNKi QuickRef

SliNKi QuickRef 1

• {slinki} boots the SliNKi environment.
• May contain a JSON array of settings...

{slinki}
{	"title": "Your title here",
	"copyright": "Your copyright statement here",
	"scripts" : [ "/foo/baa.js", "/boo/baz.js" ]
}
{/slinki}

http://localhost:1060/book/view/book:org:netkernel:wiki:slinki/

SliNKi QuickRef 2

• {slide} defines a slide - the contents are evaluated as wiki.

• An optional class argument specifies the class to use in the slide.
• For example:

{slide+class@mytitle}

• Gives the slide a CSS class of "mytitle"

SliNKi QuickRef 3

Other macros specific to presentations are:

• {incremental} - mark list items for incremental reveal

The most powerful is:

• {request} a ROC resource request.
• {wikiref} an ROC resource request that is recursively parsed as wiki.

This lets you request other resources to include in your wiki.

A request can be either a simple URI or the full power of a declarative request.

Get SliNKi and ROC it.

To get SliNKi

1. Download a copy of NetKernel
2. Boot up NK and go to Apposite - accept all the latest updates
3. That's it.

• If you want to serve/share presentations just install "wink" and put your presentation in a wiki.