DailyJS

jQuery Roundup: Publish Subscribe, Transparency, slabText

Alex R. Young

Subscribe

@dailyjs

Facebook

Google+

jquery events graphics templating plugins text

jQuery Roundup: Publish Subscribe, Transparency, slabText

Posted by Alex R. Young on .
Featured

jquery events graphics templating plugins text

jQuery Roundup: Publish Subscribe, Transparency, slabText

Posted by Alex R. Young on .
Note: You can send your plugins and articles in for review through our contact form or @dailyjs.

Publish Subscribe Plugin

Joseph Zimmerman's Publish Subscribe Plugin (License: GPL) is an implementation of the aforementioned messaging pattern aimed at browser-based JavaScript:

var handle = $.subscribe('foo', function(topic, data) {  
  console.log(data, topic);
});

$.publish('foo bar', 'This is some data');

$.unsubscribe(handle);

The author has implemented it with core jQuery methods like $.type and $.each so the source is readily understandable.

Transparency

Transparency (GitHub: leonidas / transparency, License: MIT) by Jarno Keskikangas is a template engine for jQuery that maps JSON to DOM elements using a $.render method:

var hello = {  
  hello:   'Hello',
  goodbye: 'Goodbye!'
};

$('.container').render(hello);

This example would write the values to tags matching the selectors .hello and .goodbye:

Transparency relies on convention over configuration and requires you to have 1:1 match between CSS classes and JSON objects. The idea is to minimize the cognitive noise you have to deal with. Just call $('.container').render(data) and move on.

There's a detailed blog post about Transparency here: Implementing Semantic Anti-Templating With jQuery.

slabText

slabText example

slabText (GitHub: freqdec / slabText, License: MIT/GPLv2) by Brian McAllister splits headlines into rows, and resizes them to fill the available space. This works as the browser viewport changes.

Brian notes that this is based on Erik Loyer's slabtype algorithm, which is interesting reading for those inspired by FitText.