node recap #2
JSONSelect
This first library is JSONSelect. This library allows you to query JSON using css selectors! this seems like an obvious one, but I haven’t personally seen any other implementations.
It’s not node-specific, however it is JavaScript, so naturally it works with nodejs as well, and over all it’s just a neat concept. Suppose we have the following JSON:
{
"name": {
"first": "Lloyd",
"last": "Hilaiel"
},
"favoriteColor": "yellow",
"languagesSpoken": [
{
"language": "Bulgarian",
"level": "advanced"
},
{
"language": "English",
"level": "native"
},
{
"language": "Spanish",
"level": "beginner"
}
],
"seatingPreference": [
"window",
"aisle"
],
"drinkPreference": [
"whiskey",
"beer",
"wine"
],
"weight": 172
}
To grab the languages “Bulgarian”, “English” and “Spanish” we could issue the following query:
.languagesSpoken .language
cool!
node-canvas Image#src=Buffer
A few days ago I added support to node-canvas for Image#src= to accept Buffer objects, not only path strings. This needs to be polished, and to increase format support but we can finally apply image data from arbitrary sources:
var buf = fs.readFileSync(__dirname + '/textures/jpeg');
var img = new Image;
img.src = buf;
ctx.drawImage(img, 0, 0, 400, 400);
When the Buffer is assigned we can sniff the bytes to determine the format by looking for the “magic number”. For example a PNG starts with the following bytes “89 50 4e 47 0d 0a 1a 0a”, while a JPEG starts with “ff d8”.
Express 2.3.8
A recent Express refactor moved Connect’s router middleware into Express so that I could modify it further. This also means that Connect 2.0 will no longer have router. At first it seemed like a good idea, but routing to specific and it gives people the wrong idea, Connect is meant to be an abstraction layer for higher level frameworks, not to be used directly for application logic. Though this is not true for all cases, such as simply serving static files from a directory or two.
This commit consists of a general refactor of the router, while retaining the public API. What does this mean for Express? flexibility! For example now we may query Express to see which (if any) routes match a specific route path:
app.get('/user/:id');
// => [Route]
or routes that match any HTTP method:
app.all('/user/:id');
// => [Route, Route, Route]
this is functionally equivalent to:
app.lookup.all('/user/:id');
Another alternative is “matching” rather than “lookup”. With app.match.VERB() we can query Express to see which routes would match the url passed, for example:
app.match.get('/user/12/edit');
// => [Route]
app.match.del('/user/12');
// => [Route]
app.match.all('/user/12?foo=bar');
// => [Route, Route]
In this commit I’ve introduced the ability to register logic for defining parameters. Within Express core we only support middleware-style param pre-conditions, for example auto-loading a user for any route that includes the :uid param:
app.param('uid', function(req, res, next, uid){
User.find(uid, function(err, user){
if (err) return next(err);
req.user = user;
next();
});
});
app.get('/user/:uid, function(){
// req.user
});
while this is great, some cases can be less verbose, while still expanding to middleware-style functions, this is where express-params comes in. This plugin extends Express with additional app.param() logic, for example via RegExp:
app.param('uid', /^[0-9]+$/);
app.get('/user/:uid', function(req, res, next){
var uid = req.params.uid;
res.send('user ' + uid);
});
app.get('/user/:name', function(req, res, next){
var name = req.params.name;
res.send('user ' + name);
});
or via return value, useful for validations and coercion:
app.param('id', Number);
app.get('/user/:id', function(req, res, next){
var id = req.params.id;
res.send('typeof ' + typeof id + ' ' + id);
});
Fabric.js
This one is not node related, but I wanted to sneak it in :) Fabric is a slick client-side library providing an object model on top of canvas. It has a built-in drawing mode and path smoothing, SVG parsing and some other really cool features. If you do a lot of canvas work it’s worth checking out, the author did a good job at keeping the source clean and commented, which is very important when utilizing open source.
node-migrate
node-migrate is a very small abstract migration framework. All it cares about is that you supply an up() and down() method, and invoke the callback when your migration is complete:
exports.up = function(next){
next();
};
exports.down = function(next){
next();
};
node-migrate comes with the migrate(1) executable, allowing you to run and create migrations, for example here we add two migrations, populating ./migrations/0-add-pets.js etc.
$ migrate create add-pets
$ migrate create add-owners
The contents of our badass pet adding migration might look something like this:
var db = require('./db');
exports.up = function(next){
db.rpush('pets', 'tobi');
db.rpush('pets', 'loki');
db.rpush('pets', 'jane', next);
};
exports.down = function(next){
db.rpop('pets');
db.rpop('pets', next);
};
Now all we have to do is run the migrations:
$ migrate
up : migrations/0-add-pets.js
up : migrations/1-add-jane.js
up : migrations/2-add-owners.js
up : migrations/3-coolest-pet.js
migration : complete
The next time we run migrate, we’ll see that they have already been completed:
$ migrate
migration : complete
For more information check out the GitHub repo.
Move.js
The other night I noticed that Apple’s new iMac page showcased some really slick CSS3 animations, and wanted a really simple and intuitive way to create similar effects so I came up with Move.js.
Below is an example of the API:
move('#example-13 .box2')
.set('background-color', 'red')
.x(500)
.scale(.5)
.rotate(60)
.then()
.rotate(30)
.scale(1.5)
.set('border-radius', 5)
.set('background-color', 'white')
.then()
.set('opacity', 0)
.pop()
.pop()
.end();
It’s still in it’s early stages, and I don’t have much in the way of documentation yet however feel free to check out the site as well as the examples in the repository.
