resources/2012/02/SliNKi
search:

_ _ _ _ _ _ _

SliNKi

Wiki HTML5 Presentations with NetKernel
Press space or arrow keys to navigate
WiNK
© 2012 1060 Research


<div style="position:fixed; top: 0px; left: 0px; background-color: white; height: 100%;">
	<img src="/wink/res/slinkyTemplate/nk2010/roc-banner.png"/>
</div>
<div style="position:fixed; bottom: 50px; right: 30px; z-index: 100;">
	<img src="/wink/res/slinkyTemplate/nk2010/1060Research-xsmall.png"/>
</div>
<div style="position:fixed; bottom: 50px; left: 10px; z-index: 100; font-size: 50%;">
	<a href="http://www.1060research.com">www.1060research.com</a>
</div>

SliNKi - Wiki Presentations

Brian Sletten / Peter Rodgers
February 2012

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...

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 tell WiNK that your wiki page is a SliNKi presentation you use the {slinki} macro at the top of your wiki 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 a handy as a basic high-level preview mode)

Macro Engines

The WiNK application uses NetKernel's Wiki Resource Model. So its simple to extend with your own macro engines.

Some of the built-in engines include:

  • {notes} specifies notes that are only visible on handouts
  • {html} a block of plain HTML.
  • {wiki} a parseable block of wiki inside a block of html.
  • {image} a bitmap image reference
  • {java} - content is rendered using source code highlighting.
  • {xml} - content must be XML and is rendered using XML colour highlighting.

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};
  }
 );
 

SliNKi QuickRef 1

  • {slinki} - sets up the SliNKi environment in WiNK
  • 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}

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"



Here's an example...

class example

This slide is declared with the class argument and two classes (space separated)

  • {slide+class@mystyle}

The mystyle class is defined in your CSS like this..

.mystyle	{ background-color: #EDEA49; }

SliNKi QuickRef 3

Other macros specific to presentations are:

  • {incremental} - mark list items for incremental reveal

The most important is:

  • {request} a ROC resource request.

This lets you request other resources to include in your wiki. The included resource is recursively evaluated as wiki too.

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

Everything is a Resource

  • The presentation is a resource
    • All the slides are resources
      • Everything is a resource.
  • The representation of the presentation (not easy to say) is generated with recursive ROC requests.
  • Resource requests can be embedded using the {request} macro.
  • We added a footer on every page by declaring a request like this...

{request}meta:footer{/request}

  • Each SliNKi logo is done like this

{request}meta:slinki:logo{/request}

  • So its really easy to create slide libraries. Or if the URI is to an http:// URL - you can do "slide mashups".

To ROC it

  • NetKernel is 21st Century technology that powers some of the world's largest sites, carrier-class telecoms systems and essential Web infrastructure you probably didn't even realise you rely on.
  • Resource Oriented Computing (ROC) was conceived by 1060 Research.
  • The NetKernel Resource Oriented Computing Platform is developed by 1060 Research and is published under a dual-license open source model.
  • ROC is easy to learn and those that do never go back. Onsite Training and Consulting in Resource Oriented solutions is available from 1060 Research.

Contact

Peter
pjr [at] netkernel {dot} org
@pjr1060, @netkernel
Brian
brian [dot] sletten [at] gmail {dot} com
@bsletten

ROC News

NetKernel ROC News is published every Friday.

WiNK

Acknowledgements

  • SliNKi was developed by Brian Sletten and Peter Rodgers
  • Brian (who writes a lot of slides) provided the vision and was inspired by Dave Ragget's original Slidy script
  • In this 3rd generation of SliNKi we've integrated reveal.js as the engine for slide transitions - grateful thanks to Hakim El Hattab
  • The underlying WiNK application is an old and simple NK demo
  • The wiki resource model uses the Eclipse Mylyn Wikitext parser

License

Source Code


WiNK
© 2008-2011, 1060 Research Limited