jQuery Plugin Roundup 18

2010-08-03 00:00:00 +0100 by Alex R. Young

Welcome to the jQuery Plugin Roundup, episode 18. Remember you can send
your plugins in for review through our contact form or

I've been writing a lot of jQuery lately, and subsequently I've found
some very badly written plugins. But instead of boring you with those,
readers have sent interesting ones in!


js-fragment by Rasmus Andersson (MIT license) is a browser-based templating toolkit. It builds interfaces from fragments, which are lightweight templates.

Fragments can be combined and mixed with data, and remote fragments can
be loaded from a server. It can work with a custom version of Mustache
as well. The js-fragment site has more


jQuery.tubeplayer by Nirvana Tikku is a friendly JavaScript API for the YouTube player.
Given a suitable container, a video can be controlled like this (example
taken from the site):

    width: 600, // the width of the player
    height: 450, // the height of the player
    allowFullScreen: "true", // true by default, allow user to go full screen
    initialVideo: "DkoeNLuMbcI", // the video that is loaded into the player
    playerID: "youtube-player", // the ID of the embedded youtube player
    preferredQuality: "default",// preferred quality: default, small, medium, large, hd720
    onPlay: function(id){}, // after the play method is called
    onPause: function(){}, // after the pause method is called
    onStop: function(){}, // after the player is stopped
    onSeek: function(time){}, // after the video has been seeked to a defined point
    onMute: function(){}, // after the player is muted
    onUnMute: function(){} // after the player is unmuted

It's not exactly earth-shattering, but it's the exact kind of thing
clients ask me to do.


InputNotes by Fredi Bach lets you display errors under textareas or inputs, based on regular
expressions. As the name suggests, additional information can be
displayed as well.

$(document).ready(function() {
      sexwarning: {
        pattern: /(^|\s)sex(\s|$)/ig,
        type: 'warning',
        text: "No sex please, we're British"
      numbersnote: {
        pattern: /[0-9]/,
        type: 'note',
        text: 'Do not type numbers!'