color play.

random_color_work.js

// A Simple namespace
var App = (function () {
    return {
        ctx: null,
        theTime: null,
        width: 100,
        height: 100,
        imageData: null,
        init: function () {
            console.log("init");
            this.setupCanvas();
            this.setupImageData();
            
            this.load();
        },
        load: function () {
            console.log("load");
            this.update();
            this.draw();
        },
        update: function() {
            //console.log(".");
            var pixelCount = 4*(this.width*this.height);
            
            for (var i = 0; i < pixelCount; i += 4) {
                    this.imageData.data[i] = 255; // red
                    this.imageData.data[i+1] = 255; // green
                    this.imageData.data[i+2] = 0; // blue
                    this.imageData.data[i+3] = 255; // alpha
            }
        },
        draw: function() {
            var pixelCount = 4*(this.width*this.height);
            // Go through and draw some random colors to the canvas using the .createImageData() function
            this.ctx.putImageData(this.imageData, 0, 0);
            
            for (var i = 0; i < pixelCount; i += 3) {
                    this.imageData.data[i] = this.imageData.data[i+1]; // red
                    this.imageData.data[i+1] = this.imageData.data[i-2]<<16; // green
                    this.imageData.data[i+2] = this.imageData.data[i+2]<<2; // blue
                    this.imageData.data[i+3] = 255; // alpha
            }
            
            this.ctx.putImageData(this.imageData, 0, 200);
        },
        setupImageData: function() {
            this.imageData = this.ctx.createImageData(this.width, this.height);
        },
        setupCanvas: function() {
            this.ctx = $('#theCanvas')[0].getContext('2d');
        }
    };
})();

function randomBetween(start, end){
   return Math.floor(Math.random() * (end - start + 1) + start);
}


// A Simple Object
function SomeObject() {
    // constructor
}
SomeObject.prototype = {
    // methods and instace variables
};

// Entry point
$(document).ready(function () {
    console.log("running...");
    App.init();
});