A simple AMD setup for widgets.
JavaScript CSS
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


JSM (JavaScript Simple Modules)


A simple module setup for widgets.

What it is:

A starter kit for creating widgety modules.

How it works:

Modules are loaded and bound to UI elements. Data attributes are used to set options for each module instance.

For an example, look at the demo.

What's included:


  • init: use this function to initialize any global/non-modular helpers (lazy loaders, cookies, page tracking, etc.)
  • plugin: binds the module to a specific element. Use 'html' as the element, if the module is not bound to an UI element.

Module API

  • init: initializes the object with the options and couple it with the element.
  • @param {object literal} options An array of options.
  • @param {HTMLElement} element A DOM element.
  • publish: triggers a custom event from the element that the module is bound to
  • subscribe: subscribes to an event from any element and runs the callback
  • log: output to the console if it exists and debugging is enabled in the sub-class.
  • @param Accepts any number of arguments, any type.

More info:

Modular Js: http://briancavalier.com/presentations/pgh-js-amd-10-2011/#0

AMD is better for the web than CommonJS Modules: http://blog.millermedeiros.com/2011/09/amd-is-better-for-the-web-than-commonjs-modules/

Using AMD loaders: http://unscriptable.com/code/Using-AMD-loaders/

Class.js based off Resig's Simple Javascript Inheritance: http://ejohn.org/blog/simple-javascript-inheritance/

Thanks goes to...

These guys (whether they know it or not):

Adam Abouraya, Arne Strout, Bret Crosby, Jonathan Zuckerman, Sasha Sklar, Todd Driscoll

And these guys (they don't know it):

Alex Sexton, Brian Cavalier, John Hann, John Resig