jQuery Real-Time Push Kwwika Plugin

Kwwika ceased operation on 01/06/2011. Please migrate to Pusher

Plugins‎ > ‎

jQuery Real-Time Push Kwwika Plugin

The jQuery Real-Time Push Kwwika Plugin allows you to add real-time functionality to any web page with minimal scripting.

.kwwika(config)

Contents

1 Configuration options
2 Usage
3 Examples
4 Plugin Files

Configuration options

Property	Default value	Description
`topicAttr`	"data-topic"	The attribute that is used to identify which topics should be requested from Kwwika.
`fieldAttr`	"data-field"	The attribute that is used to identify the field that will be used to update the html contents of an element.
`transformAttr`	"data-transform"	Used to identify a function that can be used to transform or format the value of an update prior to it being injected into the page.
`transform`	function(sTopicName, sFieldName, sValue) { return sValue; }	A global transform function that is called for each update for every field value.
`log`	function(sMsg) { if (this.m_oConfig.debug) { if (window.console) { console.debug(sMsg); } else { alert(sMsg); } } }	A log function called to provide log information about how the plugin operates.
`debug`	false	Defines if the logger will output to the window.console or alert method whenever the plugin calls .log(sMsg)

Usage

Register for the Kwwika Beta programme

In order to use Kwwika you must first register so we can set up permissions within the Kwwika system to allow your website/domain to receive real-time push data from Kwwika.

So, register for the Kwwika Beta programme now.

Include script tags

You need to include the core jQuery library, the Kwwika JavaScript API and the jQuery Real-Time Push Kwwika Plugin files in your web page:

<script src="http://code.jquery.com/jquery-1.4.2.min.js" type="text/javascript"></script>

<script src="http://api.kwwika.com/latest/" type="text/javascript"></script>

<script src="http://api.kwwika.com/latest/plugins/jQuery/jquery.kwwika/jquery.kwwika.js" type="text/javascript"></script>

Define HTML

You define the topic to be requested from Kwwika by adding an attribute to an HTML element. The default attribute to identify the topic to request is data-topic. You identify the value to be placed within the element by adding a data-field attribute to the same element. In the example below if an update occurs on the /KWWIKA/TWITTER/SEARCHES/KWWIKA topic with a value for the ScreenName field it will be inserted as the html contents of the first <div> element.

We are using attributes with a prefix of "data-" as the present HTML 5 draft suggests custom attributes should use this prefix.

Custom data attributes are intended to store custom data private to the page or application, for which there are no more appropriate attributes or elements.

<html>

<body>

<div data-topic="/KWWIKA/TWITTER/SEARCHES/KWWIKA" data-field="ScreenName"></div>

<div data-topic="/KWWIKA/TWITTER/SEARCHES/KWWIKA" data-field="Text"></div>

</body>

</html>

Call the jQuery plugin

You call the jQuery Real-Time Push Kwwika Plugin in the same way you call any other jQuery plugin, by supplying a selector to the jQuery method ($) and calling the kwwika() function.

<script type="text/javascript">

$(function ()

{

$("div").kwwika();

});

</script>