Image Manipulation with HTML5 <canvas> element

Introductions too frequently concentrate on how it allows web developers to draw all manner of graphic objects, from straight lines and rectangles to complex Bezier curves, on to the screen. Here, however, I'd like to focus on another use case: photo-editing in the browser. If you're keen to see what can be done with canvas right away then skip on down to the interactive examples below and come back here when you want to find out how it's done.