DailyJS

jQuery Roundup: Mockjax, ImageMapster, Face Detection

Alex R. Young

Subscribe

@dailyjs

Facebook

Google+

jquery testing plugins imagemap

jQuery Roundup: Mockjax, ImageMapster, Face Detection

Posted by Alex R. Young on .
Featured

jquery testing plugins imagemap

jQuery Roundup: Mockjax, ImageMapster, Face Detection

Posted by Alex R. Young on .
Note: You can send your plugins and articles in for review through our [contact form](/contact.html) or [@dailyjs](http://twitter.com/dailyjs).

jQuery Mockjax

jQuery Mockjax
(GitHub: appendto / jquery-mockjax, License:
MIT or GPL) by Jonathan Sharp is a library for mocking jQuery's network requests. This can be useful when writing tests. It can mock the
same data types that jQuery supports: text, HTML, JSON, JSONP, Script,
and XML.

Mocking a request looks a lot like the ajax API:

$.mockjax({
  url: '/restful/fortune'
, responseTime: 750
, responseText: { status: 'success' }
});

Mockjax modifies jQuery using \$.extend({ ajax: function() { //
... } });
-- by passing one argument to \$.extend the jQuery object itself is modified. The original ajax module is kept
around internally and used to simulate network requests by changing
jQuery's xhr function.

As shown above, request latency can be simulated using a parameter.
There are other advanced configuration options as well, including
contentType and isTimeout.

ImageMapster

ImageMapster (GitHub: jamietre /
ImageMapster
, License: MIT)
by James Treworgy is a plugin that makes it easier to manipulate HTML
image maps. That means interesting effects can be created using image
maps and more modern HTML/CSS/JavaScript techniques, while still falling
over to the basic functionality in older browsers. The ImageMapster
demos
page

has a lot of examples -- the "Vegetable Tray" example shows off some of
the basic features.

By calling \$('img').mapster(options), ImageMapster will
attempt to bind to each image that has an associated map. An area within
the image map can be selected with
\$('area').mapster('select'). The project has lots of
options and features, but fortunately the ImageMapster
documentation

is thorough.

JavaScript Face Detection

This isn't a jQuery project, but some extremely interesting client-side
coding: JavaScript Face Detection + Canvas + Video = HTML5
Glasses!

The author, Wes Bos, has written a tutorial and the provided source
(wesbos / HTML5-Face-Detection)
for some interesting HTML5 Canvas and JavaScript that uses the Core
Computer Vision Library
.

The CCV JavaScript library uses Web Worker to parallelise computation,
but Wes said:

In the CCV examples, they provide a web worker example so we could do this asynchronously, but in my tests it was significantly slower.

The HTML5 Glasses demo
that comes with this tutorial doesn't run in real time (on my computer
it updates every 380-400ms), but the tracking library seems to work very
well.