Configure a canvas element for high-def screens (retina)

highdef_canvas.coffee

# Configure a canvas element for high-def screens (retina)
highDefCanvas = (canvas, context) ->
    pixel_ratio = window.devicePixelRatio
    if pixel_ratio
        width = canvas.width
        height = canvas.height
        canvas.width = width * pixel_ratio
        canvas.height = height * pixel_ratio
        canvas.style.width = "#{width}px"
        canvas.style.height = "#{height}px"
        context.scale(pixel_ratio, pixel_ratio)

highdef_canvas.js

// Configure a canvas element for high-def screens (retina)
function highDefCanvas(canvas, context) {
  var height, pixel_ratio, width;
  pixel_ratio = window.devicePixelRatio;
  if (pixel_ratio) {
    width = canvas.width;
    height = canvas.height;
    canvas.width = width * pixel_ratio;
    canvas.height = height * pixel_ratio;
    canvas.style.width = width + "px";
    canvas.style.height = height + "px";
    return context.scale(pixel_ratio, pixel_ratio);
  }
};