(function($) {
    'use strict';

    var Buddhabrot = require('./buddhabrot');

    $(document).ready(function() {
        var width = 500,
            height = 500

        // Setup the canvas
        var canvas = document.getElementById('main');

        // Extract 2d context
        var ctx = canvas.getContext('2d');

        // Work with imagedata
        // var imageData = ctx.createImageData(width, height);

        // Compute buddhabrot
        var buddha = new Buddhabrot(width, height);
        var image = buddha.run();

        var imageData = ctx.createImageData(canvas.width, canvas.height);
        var pixels = imageData.data;
        var length = imageData.width * imageData.height;

        for (var i = 0; i < length; i++) {
            var idx = i * 4;
            pixels[idx] = 255 * image[i];
            pixels[idx+3] = 255;
        }

        // Redraw
        ctx.putImageData(imageData, 0, 0);
    });
})(jQuery);

@@ -113,59 +113,8 @@
 ) %7B%0A
-        var width = 500,%0A            height = 500%0A%0A
     
@@ -191,25 +191,24 @@
 main');%0A
-%0A
         
 // Extra
@@ -203,71 +203,108 @@
     
-// Extract 2d context%0A        var ctx = canvas.getContext('2d')
+canvas.width = (window.innerWidth * 0.8) %7C 0;%0A        canvas.height = (window.innerHeight * 0.8) %7C 0
 ;%0A%0A 
@@ -314,91 +314,141 @@
     
-// Work
+var
  wi
+d
 th 
-imagedata%0A        // var imageData = ctx.createImageData(width, height
+= canvas.width,%0A            height = canvas.height;%0A%0A        // Extract 2d context%0A        var ctx = canvas.getContext('2d'
 );%0A%0A
@@ -847,16 +847,104 @@
 age%5Bi%5D;%0A
+            pixels%5Bidx+1%5D = 255 * image%5Bi%5D;%0A            pixels%5Bidx+2%5D = 255 * image%5Bi%5D;%0A
         

Modify color drawing in brot.js