Live Widgets¶
Moksha provides a LiveWidget that handles automatically subscribing your widget to a given message topic, or list of topics. When the widget receives a new message, the onmessage JavaScript callback will be run by the client with JSON data in the json variable.
A basic LiveWidget¶
Below is an example of a really basic live widget. This widget subscribes to the ‘stuff’ message topic, and will perform an alert upon new messages.
from moksha.wsgi.widgets.api.live import LiveWidget
class MyLiveWidget(LiveWidget):
topic = 'stuff'
onmessage = 'alert(json);'
template = "Hi, I'm a live widget!"
Live Feeds¶
A Live Feed Demo Widget¶
from moksha.feeds.widgets.live import LiveFeedWidget
The Live Feed Widget¶
The LiveFeedWidget itself is just a simple LiveWidget that uses a little bit of jQuery to add and remove feed entries from a list.
from moksha.wsgi.widgets.api.live import LiveWidget
from moksha.feeds.widgets.feed import Feed
class LiveFeedWidget(LiveWidget):
""" A live streaming feed widget """
params = {
'url': 'The feed URL',
'topic': 'A topic or list of topics to subscribe to',
'feed': 'A moksha Feed object',
}
template = '${feed(id=id, url=url)}'
onmessage = """
$.each(json, function() {
$("#${id} ul li:last").remove();
$("<li/>").html(
$("<a/>")
.attr("href", this.link)
.text(this.title))
.prependTo($("#${id} ul"));
});
"""
feed = Feed()
Dependency on GlobalResourceInjectionWidget¶
Under the hood, each LiveWidget depends on the GlobalResourceInjectionWidget to render the the javascript callbacks for their topics. Due to the way this works, you should ensure that the global resources are injected last, after each LiveWidget is rendered.