Using Snorky - ANybakk/Snorky GitHub Wiki

The library consists of the following parts:

• Snorky-core. A CommonJS compliant module that offer a program interface. It can be used with any JavaScript environment that supports such modules.
• Snorky-middleware. A middleware module for use with Connect.
• Snorky-browser. An additional file that offer a programming-free experience in browser environments.

Snorky is based on a philosophy of strict separation and use of established standards. Therefore it has been important that requirements (other than the general technology concepts being mentioned in the "Background" chapter) are kept to a bare minimum. In a perfect world, separation would be absolute, but alas; this is not a perfect world.

Some core goals for this library:

• Avoid custom syntax or languages. The users should not have to learn any new rocket science to use this library.
• Avoid UI design requirements and conformity. The users should be able to develop and maintain their UI templates without having to follow difficult rules or modifying UI-centric code.

Snorky uses jQuery, which is an excellent JavaScript library. By using it, Snorky can focus on what it's supposed to do and leave DOM operations and environment differences to jQuery.

Todo

This section explains how to set up Snorky depending on what type of environment you choose.

You will have to link the necessary scripts and resources from the UI template. At a minimum, you will have to link the core module. If you wish to use the programming-free approach, you also need the browser script. JQuery can be downloaded from their site or you can let someone like Google host it for you as shown in the example below.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" />
<script src="script/library/snorky/snorky-core.js" />
<script src="script/library/snorky/snorky-browser.js" />

var snorky = require("snorky-core");

Todo

var query = new snorky.Query();

Snorky-browser requires that queries are placed in individual SPARQL query files and referred in the template using script elements. The mime type should be “application/sparql-query” and the recommended file ending is “.rq”. The script elements must have unique IDs as they are needed for binding.

<script id="rq-articles-by-michael" type="application/sparql-query" src="script/articles-by-michael.rq" />

It is recommended, but not required, that graphs used in queries are referred using link tags. The mime type should be “application/rdf+xml”.

<link id="rdf-michael" rel="alternate" type="application/rdf+xml" href="http://www.michael.fake/graph.rdf" />

Binding involves connecting queries to elements in a UI template.

var binding = new snorky.Binding(objQuery, jqElement);

<meta name="snorky-binding" content="#BINDING_ID#,#QUERY_ID#,#ELEMENT_ID#" />

Mapping involves connecting query variables to UI elements. By default, Snorky will map variables to the descendant elements of the bound element by comparing the variable's name to the name of each child element (ignoring namespace identifiers). Or, in the case of a HTML UI template, class names will be compared. If that is not sufficient, other elements can be mapped.

binding.map(nameVariable, jqElement);

<meta name="snorky-mapping" content="#BINDING_ID#,#VARIABLE_NAME#,#ELEMENT_ID#" />

It's necessary to specify a endpoint to handle queries.

binding.setEndpoint(urlEndpoint);

<meta name="snorky-endpoint" content="#BINDING_ID#,#URL#" />

This option controls code duplication. By default, Snorky will insert query results by duplicating the bound element's first child for each item in the result.

binding.setCodeDuplication(ynCodeDuplication);

<meta name="snorky-duplicate" content="#BINDING_ID#,#YN#" />

With this option it's possible to enable automatic poll updates with a given interval. It is disabled by default.

binding.setPollRate(msPollRate);

<meta name="snorky-pollrate" content="#BINDING_ID#,#POLL_RATE#" />

With this option it's possible to bind an element to trigger polling on a specified event, without having to write a script.

binding.setPollTrigger(jqElement, nameEvent);

<meta name="snorky-polltrigger" content="#BINDING_ID#,#ELEMENT_ID#,#ELEMENT_EVENT_TYPE#" />

Snorky operates with four different states. When the state changes, JavaScript events are fired and CSS classes added, to the relevant bound element. This allows for custom event handlers and CSS rules (such as enabling a spinner or similar).

These are JavaScript events that Snorky listens to.