The JavaScript blog.


frameworks libraries jquery testing plugins navigation

jQuery Roundup: Durandal, Version.js, Navi.js

Posted on .

Note: You can send your plugins and articles in for review through our contact form.


Durandal (GitHub: BlueSpire / Durandal, License: MIT) combines jQuery, Knockout, and RequireJS with some of its own code to create a framework for developing single page applications. Durandal apps are built using AMD-based modules, and it also supports the notion of a widget.

One interesting feature is application-wide messaging -- the main app object can handle events, so it can be used as a universal message bus to help keep functionality nicely decoupled.

The project includes Jasmine/PhantomJS tests in the test/ directory, but the documentation itself doesn't mention tests and the application skeletons don't include them either. That seems like an oversight to me, given that the project claims to be "single page apps done right".


Justin Stayton sent in Version.js (jstayton / version.js, License: MIT, bower: version.js), which he developed while testing scripts against multiple versions of jQuery. It works by using attributes to specify the required versions of libraries:

<script src="version.js" data-url="google" data-lib="jquery" data-ver="1.7.2"></script>  

This will cause jQuery 1.7.2 to be loaded from Google's CDN as the default. If another version is required, the versionjs GET parameter can be used. This makes it easy to switch between versions of a dependency, which might be useful in tests or during local development.

Navi.js (GitHub: tgrant54 / Navi.js, License: MIT) by Tyler Grant makes single pages behave like a full site using hash routing. It has breadcrumb support, and can be called multiple times. The jQuery plugin method takes a hash option so you could embed multiple menus on a page, each using a different hash to distinguish between them:

  hash: '#!/'
, content: $('#naviContent')

The project's homepage has markup samples and demos.


jquery ui plugins routing navigation

jQuery Roundup: noty, jquery.tocify.js, Routie

Posted on .

Note: You can send your plugins and articles in for review through our contact form or @dailyjs.



noty (GitHub: needim / noty, License: MIT) by Nedim Arabac─▒ is a plugin for displaying notifications. It supports alerts with the usual set of levels, and also allows a prompt to be displayed. A "noty" can be created using a function that accepts an options object:

var noty = noty({ text: 'noty - a jquery notification library!' });  

An existing container can be populated using the familiar jQuery syntax:

$('.custom_container').noty({ text: 'noty - a jquery notification library!' });

Notifications can be queued, allowing a large amount of alerts to be handled sensibly. This plugin also supports themes through CSS or a JavaScript file.


jquery.tocify.js (GitHub: gfranko / jquery.tocify.js, License: MIT) by Greg Franko is a table of contents plugin that works with jQuery UI's ThemeRoller and jQuery's animation effects. It also supports history.pushState, so pressing the back button will work as expected.

Given a suitable container div, running $('#toc').tocify(); will generate a table of contents based on the headers on the page.


Routie (GitHub: jgallen23 / routie, License: MIT) by Greg Allen is a lightweight hash routing library. It's not specifically dependent on jQuery, and the author has packaged it nicely with a makefile and build instructions. Routes can be defined as follows:

routie('users', function() {  
  //this gets called when hash == #users

  'users': function() {
  'about': function() {

It also works with regular expressions to allow parameters to be accessed. Notice how parameters are mapped to the function arguments:

routie('users/:name', function(name) {  

The project includes tests written with Mocha and Chai.