soulwire/sketch.js — pull request #19 by tholex (2012-11-27 00:04:53+00:00)
Title: Adds Retina Support

Hey Justin,

This pull request introduces a new option called "retina", which is off by default, and doesn't change behavior for HTML and WebGL sketches.

For canvas sketches, flipping the retina flag to true will detect the devicePixelRatio and scale the canvas to actually produce the high-DPI image. The net result is that all of your animation is done in CSS pixels, looks right on regular displays, and shows up crisp on Retina MBP's /iPhone4+ / iPad 3+ and so on.

I do think it's a good idea to turn this off by default - fullscreen retina is a LOT of pixels, and fullscreen is on by default. This is good for smaller sketches.

The two cases in which this might change behavior would be if you reset using a custom matrix transform such as context.setTransform(1, 0, 0, 1, 0, 0); or if you rely on canvas.width for responsive measurements. Those working with custom transform matrices can easily replicate the retina-compatible effect, and those relying on canvas.width can instead use canvas.style.width to get the CSS pixel width.

If you'd like to minify the JS yourself, I can drop the second commit. Let me know if you have any other concenrs.