Doodle3D-Slicer/library/cal.js

//canvas cheat sheet
//http://cheatsheetworld.com/programming/html5-canvas-cheat-sheet/

//TODO
//Global Composite Operation
//Linear Gradient
//Radial Gradient
//Bezier Curve
//Circle
//Touch support

"use strict";
var CAL = {
	name: "Canvas Abstraction Layer",
	version: "1.0",
	author: "Casper Lamboo",
	contact: "casperlamboo@gmail.com"
};

CAL.Math = {
	clamb: function (value, min, max) {
		return (value > min) ? ((value < max) ? value : max) : min;
	},
	randomInt: function (min, max) {
		return Math.round(CAL.Math.random(min, max));
	},
	random: function (min, max) {
		min = min || 0;
		max = max === undefined ? 1 : max;

		return Math.random()*(max - min) + min;
	},
	sign: function (value) {
		return (value > 0) ? 1 : ((value < 0) ? -1 : 0);
	},
	lineCollision: function (v1, v2, v3, v4) {
		//bron: http://mathworld.wolfram.com/Line-LineIntersection.html
		var intersection = new CAL.Vector(
			((v1.x*v2.y-v1.y*v2.x)*(v3.x-v4.x)-(v1.x-v2.x)*(v3.x*v4.y-v3.y*v4.x)) / ((v1.x-v2.x)*(v3.y-v4.y)-(v1.y-v2.y)*(v3.x-v4.x)),
			((v1.x*v2.y-v1.y*v2.x)*(v3.y-v4.y)-(v1.y-v2.y)*(v3.x*v4.y-v3.y*v4.x)) / ((v1.x-v2.x)*(v3.y-v4.y)-(v1.y-v2.y)*(v3.x-v4.x))
		);

		var line1 = v1.subtract(v2).length();
		var line2 = v3.subtract(v4).length();

		var a = line1 >= v1.subtract(intersection).length();
		var b = line1 >= v2.subtract(intersection).length();
		var c = line2 >= v3.subtract(intersection).length();
		var d = line2 >= v4.subtract(intersection).length();

		return (a && b && c && d) ? intersection : false;
	}
};

CAL.Easings = {
	bounceEaseOut: function (dt, b, c, d) {
		if ((dt /= d) < (1 / 2.75)) {
			return c * (7.5625 * dt * dt) + b;
		}
		else if (dt < (2 / 2.75)) {
			return c * (7.5625 * (dt -= (1.5 / 2.75)) * dt + 0.75) + b;
		}
		else if (dt < (2.5 / 2.75)) {
			return c * (7.5625 * (dt -= (2.25 / 2.75)) * dt + 0.9375) + b;
		}
		else {
			return c * (7.5625 * (dt -= (2.625 / 2.75)) * dt + 0.984375) + b;
		}
	},
	easeIn: function (dt, b, c, d) {
		return c * (dt /= d) * dt + b;
	},
	easeOut: function (dt, b, c, d) {
		return -c * (dt /= d) * (dt - 2) + b;
	},
	easeInOut: function (dt, b, c, d) {
		if ((dt /= d / 2) < 1) {
			return c / 2 * dt * dt + b;
		}
		return -c / 2 * ((--dt) * (dt - 2) - 1) + b;
	},
	strongEaseIn: function (dt, b, c, d) {
		return c * (dt /= d) * dt * dt * dt * dt + b;
	},
	strongEaseOut: function (dt, b, c, d) {
		return c * (( dt = dt / d - 1) * dt * dt * dt * dt + 1) + b;
	},
	strongEaseInOut: function (dt, b, c, d) {
		if ((dt /= d / 2) < 1) {
			return c / 2 * dt * dt * dt * dt * dt + b;
		}
		return c / 2 * ((dt -= 2) * dt * dt * dt * dt + 2) + b;
	},
	linear: function (dt, b, c, d) {
		return c * dt / d + b;
	}
};


//this doesn't work, everything is an instance of Object in JavaScript
/*Object.prototype.clone = function () {
	var object = {};
	for (var i in this) {
		var element = this[i];

		object[i] = element.clone ? element.clone() : element;
	}
	return object;
};
Object.prototype.foreach = function (callback) {
	for (var i in this) {
		var element = this[i];

		callback(element, i);
	}
};*/


Array.prototype.foreach = function (callback, scope) {
	for (var i = 0; i < this.length; i ++) {
		var element = this[i];

		if ((scope !== undefined) ? callback.call(scope, element, i) : callback(element, i)) {
			break;
		}
	}
};
Array.prototype.foreachReverse = function (callback, scope) {
	for (var i = this.length-1; i >= 0; i --) {
		var element = this[i];

		if ((scope !== undefined) ? callback.call(scope, element, i) : callback(element, i)) {
			break;
		}
	}
};
Array.prototype.max = function () {
	var max = -Infinity;
	this.foreach(function (element) {
		if (element > max) {
			max = element;
		}
	});
	return max;
};
Array.prototype.min = function () {
	var min = Infinity;
	this.foreach(function (element) {
		if (element < min) {
			min = element;
		}
	});
	return min;
};
Array.prototype.clone = function () {
	var array = [];
	this.foreach(function (element) {
		array.push((element.clone !== undefined) ? element.clone() : element);
	});
	return array;
};
Array.prototype.remove = function () {
	for (var i = 0; i < arguments.length; i ++) {
		var element = arguments[i];
		var index = this.indexOf(element);
		if (index !== -1) {
			this.splice(index, 1);
		}
	}
};

var requestAnimFrame = (function () {
	return requestAnimationFrame || webkitRequestAnimationFrame || mozRequestAnimationFrame || function (callback) {
		setTimeout(callback, 1000/60);
	};
})();

CAL.Vector = function (x, y) {
	this.x = x || 0;
	this.y = y || 0;
};
CAL.Vector.prototype.add = function (vector) {
	var x = this.x + vector.x;
	var y = this.y + vector.y;

	return new CAL.Vector(x, y);
};
CAL.Vector.prototype.subtract = function (vector) {
	var x = this.x - vector.x;
	var y = this.y - vector.y;

	return new CAL.Vector(x, y);
};
CAL.Vector.prototype.scale = function (scalar) {
	var x = this.x * scalar;
	var y = this.y * scalar;

	return new CAL.Vector(x, y);
};
CAL.Vector.prototype.rotate = function (angle) {
	var cos = Math.cos(angle);
	var sin = Math.sin(angle);

	var x = cos*this.x - sin*this.y;
	var y = sin*this.x + cos*this.y;

	return new CAL.Vector(x, y);
};
CAL.Vector.prototype.multiply = function (vector) {
	var x = this.x * vector.x;
	var y = this.y * vector.y;

	return new CAL.Vector(x, y);
};
CAL.Vector.prototype.length = function () {
	return Math.sqrt(this.x*this.x + this.y*this.y);
};
CAL.Vector.prototype.normal = function () {
	return new CAL.Vector(this.y, -this.x);
};
CAL.Vector.prototype.normalize = function () {
	var length = this.length();

	var x = this.x/length;
	var y = this.y/length;

	return new CAL.Vector(x, y);
};
CAL.Vector.prototype.angle = function () {
	return Math.atan2(this.y, this.x);
};
CAL.Vector.prototype.dot = function (vector) {
	return this.x * vector.x + this.y * vector.y;
};
CAL.Vector.prototype.cross = function (vector) {
	return this.x * vector.y - this.y * vector.x;
};
CAL.Vector.prototype.round = function () {
	var x = Math.round(this.x);
	var y = Math.round(this.y);

	return new CAL.Vector(x, y);
};
CAL.Vector.prototype.applyMatrix = function (matrix) {
	var m = matrix.matrix;

	var x = m[0]*this.x + m[1]*this.y + m[2];
	var y = m[3]*this.x + m[4]*this.y + m[5];

	return new CAL.Vector(x, y);
};
CAL.Vector.prototype.clone = function () {
	return new CAL.Vector(this.x, this.y);
};
CAL.Vector.prototype.draw = function (context, x, y) {
	var end = new CAL.Vector(this.x + x, this.y + y);
	var arrowOrigin = new CAL.Vector(x, y).add(this.subtract(this.normalize().scale(10)));
	var left = this.normal().normalize().scale(10).add(arrowOrigin);
	var right = this.normal().normalize().scale(-10).add(arrowOrigin);

	context.beginPath();
	context.moveTo(x, y);
	context.lineTo(end.x, end.y);
	context.moveTo(left.x, left.y);
	context.lineTo(end.x, end.y);
	context.lineTo(right.x, right.y);

	context.stroke();
};

CAL.Matrix = function (options) {
	options = options || {};

	if (options.matrix !== undefined && options.sx !== undefined && options.sy !== undefined && options.rotation !== undefined && options.x !== undefined && options.y !== undefined) {
		this.matrix = options.matrix;
		this._sx = options.sx;
		this._sy = options.sy;
		this._rotation = options.rotation;
		this._x = options.x;
		this._y = options.y;
	}
	else if (options instanceof Array || options.matrix) {
		this.matrix = options.matrix || options;

		this._sx = CAL.Math.sign(this.matrix[0])*Math.sqrt(Math.pow(this.matrix[0], 2) + Math.pow(this.matrix[1], 2));
		this._sy = CAL.Math.sign(this.matrix[4])*Math.sqrt(Math.pow(this.matrix[3], 2) + Math.pow(this.matrix[4], 2));
		this._rotation = Math.atan2(-this.matrix[1], this.matrix[0]);
		this._x = this.matrix[2];
		this._y = this.matrix[5];
		//source: http://math.stackexchange.com/questions/13150/extracting-rotation-scale-values-from-2d-transformation-matrix
		//BUG doesn't convert right when both sx and sy aren't 1
	}
	else {
		this._sx = options.sx !== undefined ? options.sx : 1;
		this._sy = options.sy !== undefined ? options.sy : 1;
		this._x = options.x || 0;
		this._y = options.y || 0;

		if (options.rotation === undefined) {
			this._rotation = 0;

			this.matrix = [
				this._sx, 0, this._x,
				0, this._sy, this._y
			];
		}
		else {
			this._rotation = options.rotation;
			this.updateMatrix();
		}
	}
};
CAL.Matrix.prototype = {
	get sx () {
		return this._sx;
	},
	set sx (sx) {
		this._sx = sx;
		this.updateMatrix();
	},
	get sy () {
		return this._sy;
	},
	set sy (sy) {
		this._sy = sy;
		this.updateMatrix();
	},
	get rotation () {
		return this._rotation;
	},
	set rotation (rotation) {
		this._rotation = rotation;
		this.updateMatrix();
	},
	get x () {
		return this._x;
	},
	set x (x) {
		this._x = this.matrix[2] = x;
	},
	get y () {
		return this._y;
	},
	set y (y) {
		this._y = this.matrix[5] = y;
	}
};
CAL.Matrix.prototype.updateMatrix = function () {
	this.matrix = [
		this._sx * Math.cos(this._rotation), this._sy * -Math.sin(this._rotation), this._x,
		this._sx * Math.sin(this._rotation), this._sy * Math.cos(this._rotation), this._y
	];
};
CAL.Matrix.prototype.multiplyMatrix = function (matrix) {
	var a = this.matrix;
	var b = matrix.matrix;
	var translation = new CAL.Vector(b[2], b[5]).applyMatrix(this);

	return new CAL.Matrix([
		a[0]*b[0] + a[3]*b[1], a[1]*b[0] + a[4]*b[1], translation.x,
		a[0]*b[3] + a[3]*b[4], a[1]*b[3] + a[4]*b[4], translation.y,
	]);
};
CAL.Matrix.prototype.inverse = function () {
	var m = this.matrix;
	return new CAL.Matrix([
		m[4], -m[1], -m[2],
		-m[3], m[0], -m[5]
	]);
};
CAL.Matrix.prototype.translate = function (x, y) {
	this.x += x;
	this.y += y;

	this.matrix[2] = this.x;
	this.matrix[5] = this.y;

	return this;
};
CAL.Matrix.prototype.setMatrix = function (matrix) {
	this.matrix = matrix.matrix.clone();
	this._x = matrix._x;
	this._y = matrix._y;
	this._sx = matrix._sx;
	this._sy = matrix._sy;
	this._rotation = matrix._rotation;
};
CAL.Matrix.prototype.setContext = function (context) {
	var m = this.matrix;
	context.transform(m[0], m[3], m[1], m[4], m[2], m[5]);
};
CAL.Matrix.prototype.rotateAroundAbsolute = function (angle, center) {
	if (angle !== 0) {
		var center = center
			.subtract(new CAL.Vector(this.x, this.y))
			.rotate(-this.rotation)
			.multiply(new CAL.Vector(1/this.sx, 1/this.sy));

		this.rotateAroundRelative(angle, center);
	}
};
CAL.Matrix.prototype.rotateAroundRelative = function (angle, center) {
	if (angle !== 0) {
		var before = center.applyMatrix(this);

		this.rotation += angle;
		var after = center.applyMatrix(this);

		var offset = before.subtract(after);
		
		this._x += offset.x;
		this._y += offset.y;
		this.updateMatrix();
	}
};
CAL.Matrix.prototype.clone = function () {
	return new CAL.Matrix({
		matrix: this.matrix.clone(),
		sx: this._sx,
		sy: this._sy,
		rotation: this._rotation,
		x: this._x,
		y: this._y
	});
};

CAL.Draw = function (centerX, centerY, numberWidth, numberHeight, options) {
	CAL.Matrix.call(this, options);

	this.visible = options.visible !== undefined ? options.visible : true;
	this.active = options.active || false;
	this.depth = options.depth || 0;

	this.alpha = (typeof options.alpha === "number") ? options.alpha : 1;

	this.centerX = centerX || 0;
	this.centerY = centerY || 0;
	this.index = 0;

	this.numberWidth = numberWidth || 1;
	this.numberHeight = numberHeight || 1;
	this.length = this.numberWidth*this.numberHeight;
};
CAL.Draw.prototype = Object.create(CAL.Matrix.prototype);
CAL.Draw.prototype.draw = function (context, matrix) {
	context.save();
	(matrix || this).setContext(context);
	context.globalAlpha = this.alpha;
	this.drawSimple(context, this.index, 0, 0);
	context.restore();
};
CAL.Draw.prototype.drawSimple = function (context, number, x, y) {
	var sx = (number % this.numberWidth)*this.width;
	var sy = Math.floor(number/this.numberWidth)*this.height;

	context.drawImage(this.image, sx, sy, this.width, this.height, x-this.centerX, y-this.centerY, this.width, this.height);
};
CAL.Draw.prototype.drawAlpha = function (context, number, x, y, alpha) {
	context.globalAlpha = alpha;
	this.drawSimple(context, number, x, y);
	context.globalAlpha = 1;
};
CAL.Draw.prototype.drawAngle = function (context, number, x, y, angle) {
	context.save();
	context.translate(x, y);
	context.rotate(angle);
	this.drawSimple(context, number, 0, 0);
	context.restore();
};
CAL.Draw.prototype.drawScale = function (context, number, x, y, width, height) {
	var sx = (number % this.numberWidth)*this.width;
	var sy = Math.floor(number/this.numberWidth)*this.height;

	context.drawImage(this.image, sx, sy, this.width, this.height, x-this.centerX, y-this.centerY, width, height);	
};
CAL.Draw.prototype.drawContain = function (context, number, x, y, width, height) {
	if (width/height > this.width/this.height) {
		x = x + (width-height/this.height*this.width)/2;
		width = height/this.height*this.width;
		this.drawScale(context, number, x, y, width, height);
	}
	else {
		y = y + (height-width/this.width*this.height)/2;
		height = width/this.width*this.height;
		this.drawScale(context, number, x, y, width, height);
	}
};

CAL.Surface = function (options) {
	options = options || {};
	CAL.Draw.call(this, options.centerX, options.centerY, options.numberWidth, options.numberHeight, options);

	this.clearColor = options.clearColor || false;

	this.setCanvas(options.canvas || document.createElement("canvas"));

	this.setSize(options.width, options.height);
};
CAL.Surface.prototype = Object.create(CAL.Draw.prototype);
CAL.Surface.prototype.setSize = function (width, height) {
	this.image.width = width || this.image.width;
	this.image.height = height || this.image.height;

	this.width = this.image.width/this.numberWidth;
	this.height = this.image.height/this.numberHeight;
};
CAL.Surface.prototype.setCanvas = function (canvas) {
	this.image = canvas;
	this.context = canvas.getContext("2d");
};
CAL.Surface.prototype.clear = function () {
	if (this.clearColor) {
		this.clearColor.setColor(this.context);
		this.context.fillRect(0, 0, this.image.width, this.image.height);
	}
	else {
		this.context.clearRect(0, 0, this.image.width, this.image.height);
	}
};
CAL.Surface.prototype.getImageData = function (x, y, width, height) {
	var x = x || 0;
	var y = y || 0;
	var width = width || this.image.width;
	var height = height || this.image.height;

	return this.context.getImageData(x, y, width, height);
};
CAL.Surface.prototype.getDataURL = function () {
	return this.image.toDataURL();
};
CAL.Surface.prototype.blur = (function () {
	//source: http://www.quasimondo.com/StackBlurForCanvas/StackBlurDemo.html
	//author: Mario Klingemann

	var mul_table = [512,512,456,512,328,456,335,512,405,328,271,456,388,335,292,512,454,405,364,328,298,271,496,456,420,388,360,335,312,292,273,512,482,454,428,405,383,364,345,328,312,298,284,271,259,496,475,456,437,420,404,388,374,360,347,335,323,312,302,292,282,273,265,512,497,482,468,454,441,428,417,405,394,383,373,364,354,345,337,328,320,312,305,298,291,284,278,271,265,259,507,496,485,475,465,456,446,437,428,420,412,404,396,388,381,374,367,360,354,347,341,335,329,323,318,312,307,302,297,292,287,282,278,273,269,265,261,512,505,497,489,482,475,468,461,454,447,441,435,428,422,417,411,405,399,394,389,383,378,373,368,364,359,354,350,345,341,337,332,328,324,320,316,312,309,305,301,298,294,291,287,284,281,278,274,271,268,265,262,259,257,507,501,496,491,485,480,475,470,465,460,456,451,446,442,437,433,428,424,420,416,412,408,404,400,396,392,388,385,381,377,374,370,367,363,360,357,354,350,347,344,341,338,335,332,329,326,323,320,318,315,312,310,307,304,302,299,297,294,292,289,287,285,282,280,278,275,273,271,269,267,265,263,261,259];
	var shg_table = [9,11,12,13,13,14,14,15,15,15,15,16,16,16,16,17,17,17,17,17,17,17,18,18,18,18,18,18,18,18,18,19,19,19,19,19,19,19,19,19,19,19,19,19,19,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,21,21,21,21,21,21,21,21,21,21,21,21,21,21,21,21,21,21,21,21,21,21,21,21,21,21,21,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,22,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,23,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24 ];

	return function (radius, x, y, width, height) {
		x = x || 0;
		y = y || 0;
		width = this.image.width || 0;
		height = this.image.height || 0;
		var imageData = this.getImageData(x, y, width, height);

		var x, y, i, p, yp, yi, yw, r_sum, g_sum, b_sum, a_sum, 
		r_out_sum, g_out_sum, b_out_sum, a_out_sum,
		r_in_sum, g_in_sum, b_in_sum, a_in_sum, 
		pr, pg, pb, pa, rbs;

		var div = radius + radius + 1;
		var w4 = width << 2;
		var widthMinus1 = width - 1;
		var heightMinus1 = height - 1;
		var radiusPlus1 = radius + 1;
		var sumFactor = radiusPlus1 * (radiusPlus1 + 1) / 2;
		var pixels = imageData.data;

		var stackStart = {r: 0, g: 0, b: 0, next: null};
		var stack = stackStart;
		for (i = 1; i < div; i ++) {
			stack = stack.next = {r: 0, g: 0, b: 0, next: null};
			if (i == radiusPlus1) {
				var stackEnd = stack;
			}
		}
		stack.next = stackStart;
		var stackIn = null;
		var stackOut = null;

		yw = yi = 0;

		var mul_sum = mul_table[radius];
		var shg_sum = shg_table[radius];

		for (y = 0; y < height; y ++) {
			r_in_sum = g_in_sum = b_in_sum = a_in_sum = r_sum = g_sum = b_sum = a_sum = 0;
			
			r_out_sum = radiusPlus1 * (pr = pixels[yi]);
			g_out_sum = radiusPlus1 * (pg = pixels[yi+1]);
			b_out_sum = radiusPlus1 * (pb = pixels[yi+2]);
			a_out_sum = radiusPlus1 * (pa = pixels[yi+3]);
			
			r_sum += sumFactor * pr;
			g_sum += sumFactor * pg;
			b_sum += sumFactor * pb;
			a_sum += sumFactor * pa;
			
			stack = stackStart;
			
			for (i = 0; i < radiusPlus1; i ++) {
				stack.r = pr;
				stack.g = pg;
				stack.b = pb;
				stack.a = pa;
				stack = stack.next;
			}
			
			for (i = 1; i < radiusPlus1; i ++) {
				p = yi + ((widthMinus1 < i ? widthMinus1 : i) << 2);
				r_sum += (stack.r = (pr = pixels[p])) * (rbs = radiusPlus1 - i);
				g_sum += (stack.g = (pg = pixels[p+1])) * rbs;
				b_sum += (stack.b = (pb = pixels[p+2])) * rbs;
				a_sum += (stack.a = (pa = pixels[p+3])) * rbs;
				
				r_in_sum += pr;
				g_in_sum += pg;
				b_in_sum += pb;
				a_in_sum += pa;
				
				stack = stack.next;
			}
			
			stackIn = stackStart;
			stackOut = stackEnd;
			for (x = 0; x < width; x ++) {
				pixels[yi+3] = pa = (a_sum * mul_sum) >> shg_sum;
				if (pa === 0) {
					pixels[yi] = pixels[yi+1] = pixels[yi+2] = 0;
				}
				else {
					pa = 255 / pa;
					pixels[yi] = ((r_sum * mul_sum) >> shg_sum) * pa;
					pixels[yi+1] = ((g_sum * mul_sum) >> shg_sum) * pa;
					pixels[yi+2] = ((b_sum * mul_sum) >> shg_sum) * pa;
				}
				
				
				r_sum -= r_out_sum;
				g_sum -= g_out_sum;
				b_sum -= b_out_sum;
				a_sum -= a_out_sum;
				
				r_out_sum -= stackIn.r;
				g_out_sum -= stackIn.g;
				b_out_sum -= stackIn.b;
				a_out_sum -= stackIn.a;
				
				p = (yw + ((p = x + radius + 1) < widthMinus1 ? p : widthMinus1)) << 2;
				
				r_in_sum += (stackIn.r = pixels[p]);
				g_in_sum += (stackIn.g = pixels[p+1]);
				b_in_sum += (stackIn.b = pixels[p+2]);
				a_in_sum += (stackIn.a = pixels[p+3]);
				
				r_sum += r_in_sum;
				g_sum += g_in_sum;
				b_sum += b_in_sum;
				a_sum += a_in_sum;
				
				stackIn = stackIn.next;
				
				r_out_sum += (pr = stackOut.r);
				g_out_sum += (pg = stackOut.g);
				b_out_sum += (pb = stackOut.b);
				a_out_sum += (pa = stackOut.a);
				
				r_in_sum -= pr;
				g_in_sum -= pg;
				b_in_sum -= pb;
				a_in_sum -= pa;
				
				stackOut = stackOut.next;

				yi += 4;
			}
			yw += width;
		}


		for (x = 0; x < width; x ++) {
			g_in_sum = b_in_sum = a_in_sum = r_in_sum = g_sum = b_sum = a_sum = r_sum = 0;
			
			yi = x << 2;
			r_out_sum = radiusPlus1 * (pr = pixels[yi]);
			g_out_sum = radiusPlus1 * (pg = pixels[yi+1]);
			b_out_sum = radiusPlus1 * (pb = pixels[yi+2]);
			a_out_sum = radiusPlus1 * (pa = pixels[yi+3]);
			
			r_sum += sumFactor * pr;
			g_sum += sumFactor * pg;
			b_sum += sumFactor * pb;
			a_sum += sumFactor * pa;
			
			stack = stackStart;
			
			for (i = 0; i < radiusPlus1; i ++) {
				stack.r = pr;
				stack.g = pg;
				stack.b = pb;
				stack.a = pa;
				stack = stack.next;
			}
			
			yp = width;
			
			for (i = 1; i <= radius; i ++) {
				yi = (yp + x) << 2;
				
				r_sum += (stack.r = (pr = pixels[yi])) * (rbs = radiusPlus1 - i);
				g_sum += (stack.g = (pg = pixels[yi+1])) * rbs;
				b_sum += (stack.b = (pb = pixels[yi+2])) * rbs;
				a_sum += (stack.a = (pa = pixels[yi+3])) * rbs;
			 
				r_in_sum += pr;
				g_in_sum += pg;
				b_in_sum += pb;
				a_in_sum += pa;
				
				stack = stack.next;
			
				if (i < heightMinus1) {
					yp += width;
				}
			}
			
			yi = x;
			stackIn = stackStart;
			stackOut = stackEnd;
			for (y = 0; y < height; y ++) {
				p = yi << 2;
				pixels[p+3] = pa = (a_sum * mul_sum) >> shg_sum;
				if (pa > 0) {
					pa = 255 / pa;
					pixels[p] = ((r_sum * mul_sum) >> shg_sum) * pa;
					pixels[p+1] = ((g_sum * mul_sum) >> shg_sum) * pa;
					pixels[p+2] = ((b_sum * mul_sum) >> shg_sum) * pa;
				}
				else {
					pixels[p] = pixels[p+1] = pixels[p+2] = 0;
				}
				
				r_sum -= r_out_sum;
				g_sum -= g_out_sum;
				b_sum -= b_out_sum;
				a_sum -= a_out_sum;
			 
				r_out_sum -= stackIn.r;
				g_out_sum -= stackIn.g;
				b_out_sum -= stackIn.b;
				a_out_sum -= stackIn.a;
				
				p = (x + (((p = y + radiusPlus1) < heightMinus1 ? p : heightMinus1) * width)) << 2;
				
				r_sum += (r_in_sum += (stackIn.r = pixels[p]));
				g_sum += (g_in_sum += (stackIn.g = pixels[p+1]));
				b_sum += (b_in_sum += (stackIn.b = pixels[p+2]));
				a_sum += (a_in_sum += (stackIn.a = pixels[p+3]));
			 
				stackIn = stackIn.next;
				
				r_out_sum += (pr = stackOut.r);
				g_out_sum += (pg = stackOut.g);
				b_out_sum += (pb = stackOut.b);
				a_out_sum += (pa = stackOut.a);
				
				r_in_sum -= pr;
				g_in_sum -= pg;
				b_in_sum -= pb;
				a_in_sum -= pa;
				
				stackOut = stackOut.next;
				
				yi += width;
			}
		}
		return imageData;
	};
})();

CAL.Draw.prototype.drawBlur = (function () {
	var surface = new CAL.Surface();

	return function (context, number, x, y, radius) {
		if (radius > 0) {
			surface.setSize(this.width + 2*radius, this.height + 2*radius);
			this.drawSimple(surface.context, number, this.centerX+radius, this.centerY+radius);
			var imageData = surface.blur(radius);
			
			context.putImageData(imageData, x-this.centerX - radius, y-this.centerY - radius);

			/*surface.setSize(this.width, this.height);
			this.drawSimple(surface.context, number, this.centerX, this.centerY);
			var imageData = surface.blur(radius);
			
			context.putImageData(imageData, x-this.centerX, y-this.centerY);*/
		}
		else {
			this.drawSimple(context, number, x, y);
		}
	};
})();

CAL.Group = function (options) {
	options = options || {};
	CAL.Surface.call(this, options);

	this.active = true;
	this.visible = true;

	this.objects = [];
	this.useCanvas = options.useCanvas || false;

	this.clearCanvas = true;
	this.drawCanvas = true;

	this.mouse = {
		x: null,
		y: null,
		startX: null,
		startY: null,
		deltaX: null,
		deltaY: null,
		down: false,
		moved: false
	};
};
CAL.Group.prototype = Object.create(CAL.Surface.prototype);
CAL.Group.prototype.updateEvents = function () {
	var scope = this;
	this.image.onmousedown = function (event) {
		if (scope.useCanvas) {
			scope.mouse.x = scope.mouse.startX = Math.round(scope.image.width / scope.image.clientWidth * event.offsetX);
			scope.mouse.y = scope.mouse.startY = Math.round(scope.image.height / scope.image.clientHeight * event.offsetY);
			scope.mouse.deltaX = 0;
			scope.mouse.deltaY = 0;
			scope.mouse.down = true;
			scope.mouse.moved = false;

			scope.mouseDown(scope.mouse, this);
		}
	};
	this.image.onmouseup = function (event) {
		if (scope.useCanvas) {
			scope.mouse.x = Math.round(scope.image.width / scope.image.clientWidth * event.offsetX);
			scope.mouse.y = Math.round(scope.image.height / scope.image.clientHeight * event.offsetY);
			scope.mouse.down = false;

			scope.mouseUp(scope.mouse, this);

			scope.mouse.startX = null;
			scope.mouse.startY = null;
			scope.mouse.deltaX = null;
			scope.mouse.deltaY = null;
			scope.mouse.moved = false;
		}
	};
	this.image.onmousemove = function (event) {
		if (scope.useCanvas) {
			scope.mouse.x = Math.round(scope.image.width / scope.image.clientWidth * event.offsetX);
			scope.mouse.y = Math.round(scope.image.height / scope.image.clientHeight * event.offsetY);
			if (scope.mouse.down) {
				scope.mouse.moved = true;
				scope.mouse.deltaX = scope.mouse.x - scope.mouse.startX;
				scope.mouse.deltaY = scope.mouse.y - scope.mouse.startY;
			}
		}
	};
	//this.image.ontouchstart = function (event) {scope.touchStart(event);};
	//this.image.ontouchmove = function (event) {scope.touchMove(event);};
	//this.image.ontouchend = function (event) {scope.touchEnd(event);};
};
CAL.Group.prototype.setCanvas = function (canvas) {
	/*this.image.onmousedown = null;
	this.image.onmouseup = null;
	this.image.onmousemove = null;
	this.image.ontouchstart = null;
	this.image.ontouchmove = null;
	this.image.ontouchend = null;*/

	this.image = canvas;
	this.context = canvas.getContext("2d");

	this.drawCanvas = true;
	this.updateEvents();
};
CAL.Group.prototype.add = function () {
	for (var i = 0; i < arguments.length; i ++) {
		var object = arguments[i];
		if (this.objects.indexOf(object) === -1) {
			this.objects.push(object);
			if (object.init) {
				object.init(this);
			}
		}
	}
	this.sort();
	this.drawCanvas = true;
};
CAL.Group.prototype.remove = function () {
	for (var i = 0; i < arguments.length; i ++) {
		var object = arguments[i];
		this.objects.remove(object);
		if (object.active && object.remove !== undefined) {
			object.remove(this);
		}
	}
	this.drawCanvas = true;
};
CAL.Group.prototype.sort = function () {
	this.objects.sort(function (a, b) {
		return (a.depth || 0) - (b.depth || 0);
	});
};
CAL.Group.prototype.keyDown = function (keyCode) {
	for (var i = this.objects.length-1; i >= 0; i --) {
		var object = this.objects[i];
		if (object.active && object.keyDown !== undefined) {
			if (object.keyDown(keyCode, this)) {
				break;
			}
		}
	}
};
CAL.Group.prototype.keyUp = function (keyCode) {
	for (var i = this.objects.length-1; i >= 0; i --) {
		var object = this.objects[i];
		if (object.active && object.keyUp !== undefined) {
			if (object.keyUp(keyCode, this)) {
				break;
			}
		}
	}
};
CAL.Group.prototype.mouseDown = function (mouse) {
	for (var i = this.objects.length-1; i >= 0; i --) {
		var object = this.objects[i];
		if (object.useCanvas !== true && object.active && object.mouseDown !== undefined) {
			if (object.mouseDown(mouse, this)) {
				break;
			}
		}
	}
};
CAL.Group.prototype.mouseUp = function (mouse) {
	for (var i = this.objects.length-1; i >= 0; i --) {
		var object = this.objects[i];
		if (object.useCanvas !== true && object.active && object.mouseUp !== undefined) {
			if (object.mouseUp(mouse, this)) {
				break;
			}
		}
	}
};
CAL.Group.prototype.step = function (deltaTime) {
	for (var i = 0; i < this.objects.length; i ++) {
		var object = this.objects[i];
		if (object.active && object.step !== undefined) {
			object.step(deltaTime, this);
		}
	}

	if (this.clearCanvas && this.useCanvas) {
		this.clear();
	}

	if (this.drawCanvas && this.useCanvas) {
		this.draw();
	}

	this.clearCanvas = false;
	this.drawCanvas = false;
};
CAL.Group.prototype.draw = function (context, matrix) {
	context = this.useCanvas ? this.context : context;
	matrix = this.useCanvas ? this : matrix;

	for (var i = 0; i < this.objects.length; i ++) {
		var object = this.objects[i];
		if (object.useCanvas !== true && object.visible && object.draw !== undefined) {
			if (object instanceof CAL.Matrix) {
				object.draw(context, matrix.multiplyMatrix(object));
			}
			else {
				object.draw(context, matrix);
			}
		}
	}
};

CAL.Scene = function () {
	CAL.Group.call(this, {useCanvas: true});

	this.lastTime = new Date().getTime();

	this.keysDown = [];
	this.focus = true;

	var scope = this;
	window.onkeydown = function (event) {
		if (!scope.keysDown[event.keyCode]) {
			scope.keysDown[event.keyCode] = true;
			scope.keyDown(event.keyCode);
		}
	};
	window.onkeyup = function (event) {
		scope.keysDown[event.keyCode] = false;

		scope.keyUp(event.keyCode);
	};
	window.onblur = function (event) {
		this.focus = false;
	};
	window.onfocus = function (event) {
		scope.lastTime = new Date().getTime();
		this.focus = true;
	};
};
CAL.Scene.prototype = Object.create(CAL.Group.prototype);
CAL.Scene.prototype.cycle = function () {
	if (this.focus) {
		var currentTime = new Date().getTime();
		var deltaTime = currentTime-this.lastTime;
		this.lastTime = currentTime;

		this.step(deltaTime);
	}
};
CAL.Scene = new CAL.Scene();

CAL.Image = function (source, centerX, centerY, numberWidth, numberHeight, options) {
	options = options || {};
	CAL.Draw.call(this, centerX, centerY, numberWidth, numberHeight, options);

	this.image = new Image();
	this.source = source;
};
CAL.Image.prototype = Object.create(CAL.Draw.prototype);
CAL.Image.prototype.load = function (callback) {
	var scope = this;
	this.image.onload = function () {
		scope.loaded = true;

		scope.width = scope.image.width/scope.numberWidth;
		scope.height = scope.image.height/scope.numberHeight;

		if (callback !== undefined) {
			callback();
		}
	};
	this.image.src = this.source;
};

CAL.ImageLoader = function () {
	this.images = [];

	for (var i = 0; i < arguments.length; i ++) {
		var image = arguments[i];
		this.images.push(image);
	}
};
CAL.ImageLoader.prototype.add = function () {
	for (var i = 0; i < arguments.length; i ++) {
		var image = arguments[i];
		if (this.images.indexOf(image) === -1) {
			this.images.push(image);
		}
	}
};
CAL.ImageLoader.prototype.remove = function () {
	for (var i = 0; i < arguments.length; i ++) {
		var image = arguments[i];
		this.images.remove(image);
	}
};
CAL.ImageLoader.prototype.load = function (callback) {
	var imagesToLoad = this.images.length;
	for (var i = 0; i < this.images.length; i ++) {
		var image = this.images[i];
		image.load(function () {
			imagesToLoad --;
			if (imagesToLoad === 0 && callback !== undefined) {
				callback();
			}
		}, this);
	};
};

CAL.Color = function () {
	if (typeof arguments[0] === "number" && typeof arguments[1] === "number" && typeof arguments[2] === "number") {
		this.r = arguments[0];
		this.g = arguments[1];
		this.b = arguments[2];
		this.a = typeof arguments[3] === "number" ? arguments[3] : 1;
	}
	else if (typeof arguments[0] === "number") {
		var hex = Math.floor(arguments[0]);

		this.r = hex >> 16 & 255;
		this.g = hex >> 8 & 255;
		this.b = hex & 255;
		this.a = 1;
	}
	else {
		this.r = 0;
		this.g = 0;
		this.b = 0;
		this.a = 1;
	}
};
CAL.Color.prototype.setStroke = function (context) {
	context.strokeStyle = "rgba("+this.r+", "+this.g+", "+this.b+", "+this.a+")";
};
CAL.Color.prototype.setFill = function (context) {
	context.fillStyle = "rgba("+this.r+", "+this.g+", "+this.b+", "+this.a+")";
};
CAL.Color.prototype.setColor = function (context) {
	this.setStroke(context);
	this.setFill(context);
};

CAL.Tween = function (object, attributes, duration, options) {
	options = options || {};
	this.visible = false;
	this.active = true;
	this.depth = -10000;

	this.object = object;
	this.attributes = attributes;
	this.timer = 0;
	this.duration = duration;
	this.easing = options.easing || CAL.Easings.linear;
	this.callback = options.callback;

	this.begin = {};
	for (var i in attributes) {
		this.begin[i] = this.object[i];
	}

	this.change = {};
	for (var i in attributes) {
		this.change[i] = attributes[i] - this.begin[i];
	}

	this.drawCanvas = options.drawCanvas !== undefined ? options.drawCanvas : true;
	this.clearCanvas = options.clearCanvas !== undefined ? options.clearCanvas : false;
};
CAL.Tween.prototype.start = function () {
	this.t = 0;
	this.active = true;
};
CAL.Tween.prototype.stop = function () {
	this.t = 0;
	this.active = false;
};
CAL.Tween.prototype.pause = function () {
	this.active = false;
};
CAL.Tween.prototype.resume = function () {
	this.active = true;
};
CAL.Tween.prototype.step = function (deltaTime, group) {
	this.timer += deltaTime;

	if (this.timer < this.duration) {

		for (var i in this.attributes) {
			var dt = this.timer;
			var d = this.duration;
			var b = this.begin[i];
			var c = this.change[i];
			
			this.object[i] = this.easing(dt, b, c, d);
		}
	}
	else {
		for (var i in this.attributes) {
			this.object[i] = this.attributes[i];
		}
		if (this.callback !== undefined) {
			this.callback();
		}
		group.remove(this);
	}

	if (this.clearCanvas) {
		group.clearCanvas = true;
	}
	if (this.drawCanvas) {
		group.drawCanvas = true;
	}
};

CAL.TimeLine = function (options) {
	options = options || {};
	
	this.visible = false;
	this.active = true;
	this.depth = -10000;

	this.moments = [];
	this.autoRemove = (options.autoRemove !== undefined) ? options.autoremove : true;
	this.loop = (options.loop !== undefined) ? options.loop : false;
	this.t = 0;

	CAL.Scene.add(this);
};
CAL.TimeLine.prototype = {
	addMoment: function (time, callback) {
		this.moments.push({
			time: time,
			callback: callback
		});
	},
	removeMoment: function (remove) {
		for (var i = 0; i < this.moments.length; i ++) {
			var moment = this.moments[i];

			if (moment === remove || moment.time === remove || moment.callback === remove) {
				this.moments.remove(moment);
			}
		}
	},
	start: function () {
		this.t = 0;
		this.active = true;
	},
	stop: function () {
		this.t = 0;
		this.active = false;
	},
	pause: function () {
		this.active = false;
	},
	resume: function () {
		this.active = true;
	},
	step: function (dt) {
		var newTime = this.t + dt;
		var remove = true;

		for (var i = 0; i < this.moments.length; i ++) {
			var moment = this.moments[i];
			if (moment.time >= this.t) {
				if (moment.time < newTime) {
					moment.callback();
				}
				else {
					remove = false;
				}
			}
		}

		if (remove && this.loop) {
			this.t = 0;
		}
		else if (remove && this.autoRemove) {
			CAL.Scene.remove(this);
		}
		this.t = newTime;
	}
};

CAL.Shape = function (options) {
	options = options || {};
	CAL.Matrix.call(this, options);

	this.visible = options.visible !== undefined ? options.visible : true;
	this.active = false;
	this.depth = options.depth || 0;
	this.lines = [];

	this.closePath = options.closePath !== undefined ? options.closePath : true;
	this.lineColor = options.lineColor !== undefined ? options.lineColor : new CAL.Color();
	this.shapeColor = options.shapeColor !== undefined ? options.shapeColor : new CAL.Color();
	this.lineWidth = options.lineWidth || 1;
	this.lineJoin = options.lineJoin || "miter";
	this.lineCap = options.lineCap || "square";

	this.points = options.points || [];
};
CAL.Shape.prototype = Object.create(CAL.Matrix.prototype);
CAL.Shape.prototype.addPoint = function () {
	for (var i = 0; i < arguments.length; i ++) {
		var point = arguments[i];
		this.points.push(point);
	}
	//this.update();
};
CAL.Shape.prototype.hit = function (x, y) {

	for (var i = 0; i < this.points.length; i ++) {
		if (new CAL.Vector(x, y).subtract(this.points[i].applyMatrix(this)).dot(this.getNormal(i)) > 0) {
			return false;
		}
	}

	return true;
};
CAL.Shape.prototype.setContext = function (context, matrix) {
	var matrix = matrix || this;
	context.beginPath();
	for (var i = 0; i < this.points.length; i ++) {
		var point = this.points[i].applyMatrix(matrix);
		context.lineTo(point.x, point.y);
	}
	if (this.closePath) {
		context.closePath();
	}
};
CAL.Shape.prototype.getBoundingBox = function () {
	var minX = Infinity;
	var minY = Infinity;
	var maxX = -Infinity;
	var maxY = -Infinity;

	for (var i = 0; i < this.points.length; i ++) {
		var point = this.points[i];
		minX = point.x < minX ? point.x : minX;
		minY = point.y < minY ? point.y : minY;
		maxX = point.x > maxX ? point.x : maxX;
		maxY = point.y > maxY ? point.y : maxY;
	};

	return {x: minX, y: minY, width: maxX-minX, height: maxY-minY};
};
CAL.Shape.prototype.getNormal = function (i) {
	var pointA = this.points[(i+1)%this.points.length].applyMatrix(this);
	var pointB = this.points[i].applyMatrix(this);
	return pointA.subtract(pointB).normal().normalize();
};
CAL.Shape.prototype.clip = function (context, matrix) {
	this.setContext(context, matrix);
	context.clip();
};
CAL.Shape.prototype.fill = function (context, matrix) {
	this.setContext(context, matrix);

	this.shapeColor.setFill(context);

	context.fill();
};
CAL.Shape.prototype.stroke = function (context, matrix) {
	this.setContext(context, matrix);

	context.lineColor = this.lineColor;
	context.lineWidth = this.lineWidth;
	context.lineJoin = this.lineJoin;
	context.lineCap = this.lineCap;

	this.lineColor.setStroke(context);

	context.stroke();
};
CAL.Shape.prototype.draw = function (context, matrix) {
	this.setContext(context, matrix);

	if (this.shapeColor) {
		this.shapeColor.setFill(context);
		context.fill();
	}

	if (this.lineColor) {
		context.lineColor = this.lineColor;
		context.lineWidth = this.lineWidth;
		context.lineJoin = this.lineJoin;
		context.lineCap = this.lineCap;
		this.lineColor.setStroke(context);
		context.stroke();
	}
};

CAL.BezierPoint = function (position, controlPointA, controlPointB) {
	this.position = position || new CAL.Vector(0, 0);
	this.controlPointA = controlPointA || new CAL.Vector(0, 0);
	this.controlPointB = controlPointB || new CAL.Vector(0, 0);
}
CAL.BezierPoint.prototype.applyMatrix = function (matrix) {
	var position = this.position.applyMatrix(matrix);
	var controlPointA = this.controlPointA.applyMatrix(matrix);
	var controlPointB = this.controlPointB.applyMatrix(matrix);

	return new CAL.BezierPoint(position, controlPointA, controlPointB);
};
CAL.BezierPoint.prototype.draw = function (context) {
	var leftHandle = this.controlPointA.add(this.position);
	var rightHandle = this.controlPointB.add(this.position);

	context.strokeStyle = "#09F";

	context.beginPath();
	context.moveTo(leftHandle.x, leftHandle.y);
	context.lineTo(this.position.x, this.position.y);
	context.lineTo(rightHandle.x, rightHandle.y);
	context.stroke();

	context.beginPath();
	context.arc(this.position.x, this.position.y, 10, 0, Math.PI*2, true);
	context.stroke();

	context.beginPath();
	context.arc(leftHandle.x, leftHandle.y, 5, 0, Math.PI*2, true);
	context.stroke();

	context.beginPath();
	context.arc(rightHandle.x, rightHandle.y, 5, 0, Math.PI*2, true);
	context.stroke();	
};
/*CAL.Shape = function (options) {
	options = options || {};
	CAL.Matrix.call(this, options);

	this.visible = options.visible !== undefined ? options.visible : true;
	this.active = false;
	this.depth = options.depth || 0;

	this.closePath = options.closePath !== undefined ? options.closePath : true;
	this.lineColor = options.lineColor !== undefined ? options.lineColor : new CAL.Color();
	this.shapeColor = options.shapeColor !== undefined ? options.shapeColor : new CAL.Color();
	this.lineWidth = options.lineWidth || 1;
	this.lineJoin = options.lineJoin || "miter";
	this.lineCap = options.lineCap || "square";

	this.points = options.points || [];
	this.precision = options.precision || 3;

	this.lines = [];
	this.length = 0;
	this.closed = false;
}
CAL.Shape.prototype.init = function (group) {
	for (var i = 0; i < this.points.length; i ++) {
		var point = this.points[i];
		if (point instanceof CAL.Vector) {
			point = new CAL.BezierPoint(point);
		}
		this.points[i] = point;
	}

	this.update();
};
CAL.Shape.prototype.addPoint = function () {
	for (var i = 0; i < arguments.length; i ++) {
		var point = arguments[i];

		if (point instanceof CAL.Vector) {
			point = new CAL.BezierPoint(point);
		}
		if (point instanceof CAL.BezierPoint) {
			this.points.push(point);
		}
	}

	this.update();
};
CAL.Shape.prototype.collisionBox = function (vec1, vec2) {
	for (var i = 0; i < this.lines.length; i ++) {
		var point = this.lines[i];

		if (point.x > vec1.x && point.y > vec1.y && point.x < vec2.x && point.y < vec2.y) {
			return true;
		}
	}
	return false;
};
CAL.Shape.prototype.getNormal = function (i) {
	var pointA = this.lines[(i+1)%this.lines.length].applyMatrix(this);
	var pointB = this.lines[i].applyMatrix(this);
	return pointA.subtract(pointB).normal().normalize();
};
CAL.Shape.prototype.collisionPoint = function (x, y) {
	for (var i = 0; i < this.lines.length; i ++) {
		if (new CAL.Vector(x, y).subtract(this.lines[i].applyMatrix(this)).dot(this.getNormal(i)) > 0) {
			return false;
		}
	}

	return true;
};
CAL.Shape.prototype.removePoint = function () {
	for (var i = 0; i < arguments.length; i ++) {

		var argument = arguments[i];

		if (typeof argument === "number") {
			var index = argument;
		}
		else if (argument instanceof CAL.BezierPoint || argument instanceof CAL.Vector) {
			var index = this.getPointIndex(argument);
		}

		if (index !== -1) {
			this.points.splice(index, 1);
		}
	}

	this.update();
};

CAL.Shape.prototype.getPointIndex = function (point) {
	if (point instanceof CAL.BezierPoint) {
		return this.points.indexOf(argument);
	}
	else if (point instanceof CAL.Vector) {
		for (i = 0; i < this.points.length; i ++) {
			var length = this.points[i].position.subtract(point).length();

			if (length === 0) {
				return i;
			}
		}
		return -1;
	}
};

CAL.Shape.prototype.numberPoints = function () {
	return this.points.length;
};

CAL.Shape.prototype.insertPoint = function (point, index) {
	if (point instanceof CAL.Vector) {
		point = new CAL.BezierPoint(point);
	}
	if (point instanceof CAL.BezierPoint) {
		this.points.splice(index, 0, point);

		this.update();
	}	
};
CAL.Shape.prototype.setClosed = function (closed) {
	this.closed = closed;
	this.update();
};

CAL.Shape.prototype.setPrecision = function (precision) {
	this.precision = precision;
	this.update();
};

CAL.Shape.prototype.makeSmooth = function (strength, start, end) {
	start = start || 0;
	end = end || this.points.length;

	if (this.closed === false) {
		start = Math.max(start, 1);
		end = Math.min(end, this.points.length-1);
	}
	else {
		start = Math.max(start, 0);
		end = Math.min(end, this.points.length);
	}

	for (var i = start; i < end; i ++) {
		var p0 = this.points[i-1];
		var p1 = this.points[i];
		var p2 = this.points[i+1];

		if (typeof(p0) === "undefined") {
			p0 = this.points[this.points.length-1];
		}
		else if (typeof(p2) === "undefined") {
			p2 = this.points[0];
		}

		var a = p0.position.subtract(p1.position);
		var b = p2.position.subtract(p1.position);

		var length = (a.length()+b.length())/4;

		var direction = a.normalize().add(b.scale(-1).normalize()).normalize();

		p1.controlPointA = direction.scale(length*strength);
		p1.controlPointB = direction.scale(-length*strength);
	}

	this.update();
};

CAL.Shape.prototype.calculateBezierPoints = function (p0, p1) {
	var array = [];

	if (p0.controlPointB.length() === 0 && p1.controlPointA.length() === 0) {
		var angle = p1.position.subtract(p0.position).angle();

		array.push({
			x: p0.position.x,
			y: p0.position.y,
			angle: angle
		}, {
			x: p1.position.x,
			y: p1.position.y,
			angle: angle
		});
	}
	else {
		var point = {
			x: p1.position.x,
			y: p1.position.y,
			angle: p1.controlPointB.direction()
		}

		array = array.concat(
			recursiveBezier(
				p0.position,
				p0.position.add(p0.controlPointB),
				p1.position.add(p1.controlPointA),
				p1.position,
				this.precision
			),
			[point]
		);
	}

	return array;
};

CAL.Shape.prototype.update = function () {
	if (this.points.length >= 2) {
		if (this.points[0].controlPointB.length() !== 0) {
			var point = {
				x: this.points[0].position.x,
				y: this.points[0].position.y,
				angle: this.points[0].controlPointB.direction()
			};
			this.lines = [point];
		}

		for (var i = 0; i < this.points.length-1; i ++) {
			var p0 = this.points[i];
			var p1 = this.points[i+1];

			this.lines = this.lines.concat(this.calculateBezierPoints(p0, p1));
		}

		if (this.closed === true) {

			var p0 = this.points[this.points.length-1];
			var p1 = this.points[0];

			this.lines = this.lines.concat(this.calculateBezierPoints(p0, p1));
		}

		var pathLength = 0;
		this.lines[0].position = 0;

		for (var i = 0; i < this.lines.length-1; i ++) {

			var p0 = this.lines[i];
			var p1 = this.lines[i+1];
			var line = new CAL.Vector(p1.x, p1.y).subtract(p0);
			pathLength += line.length();

			p1.position = pathLength;
		}
		 
		this.length = pathLength;
	}
};

CAL.Shape.prototype.getPosition = function (t) {
	var t = Math.max(Math.min(t, this.length), 0);

	for (var i = 1; true; i ++) {
		var p0 = this.lines[i-1];
		var p1 = this.lines[i];

		if (p1.position >= t) {
			t = (t-p0.position) / (p1.position-p0.position);

			var position = new CAL.Vector(p0.x, p0.y).scale(1-t).add(new CAL.Vector(p1.x, p1.y).scale(t));
			var angle = p0.angle + ((((p1.angle-p0.angle)%360)+540)%360-180)*t;

			return {
				x: position.x,
				y: position.y,
				angle: angle
			};
		}
	}
};

CAL.Shape.prototype.setContextPart = function (context, begin, end) {
	var beginPos = this.getPosition(begin);
	var endPos = this.getPosition(end);

	context.beginPath();
	context.moveTo(beginPos.x, beginPos.y);

	for (var i = 0; i < this.lines.length; i ++) {
		var line = this.lines[i];

		if (line.position > begin) {

			context.lineTo(line.x, line.y);
			if (line.position > end) {
				break;
			}
		}
	}
	context.lineTo(endPos.x, endPos.y);
};

CAL.Shape.prototype.setContext = function (context) {
	this.setContextPart(context, 0, this.length);
};

CAL.Shape.prototype.setClippingPart = function (context, begin, end) {
	context.save();
	this.setContextPart(begin, end);
	context.clip();
};

CAL.Shape.prototype.setClipping = function (context) {
	this.setClippingPart(context, 0, this.length);
};

CAL.Shape.prototype.drawPart = function (context, begin, end, color, width, cap) {
	this.setContextPart(context, begin, end);
	
	context.strokeStyle = color || "black";
	context.lineWidth = width || 1;
	context.lineCap = cap || 'butt';
	context.stroke();
};
CAL.Shape.prototype.setContext = function (context, matrix) {
	var matrix = matrix || this;
	context.beginPath();
	for (var i = 0; i < this.lines.length; i ++) {
		var point = this.lines[i]//.applyMatrix(matrix);
		context.lineTo(point.x, point.y);
	}
	if (this.closePath) {
		context.closePath();
	}
};

CAL.Shape.prototype.fill = function (context, matrix) {
	this.setContext(context, matrix);

	this.shapeColor.setFill(context);

	context.fill();
};
CAL.Shape.prototype.stroke = function (context, matrix) {
	this.setContext(context, matrix);
	context.lineColor = this.lineColor;
	context.lineWidth = this.lineWidth;
	context.lineJoin = this.lineJoin;
	context.lineCap = this.lineCap;

	this.lineColor.setStroke(context);

	context.stroke();
};

CAL.Shape.prototype.draw = function (context, matrix) {
	if (this.shapeColor) {
		this.shapeColor.setFill(context);
		context.fill();
	}

	if (this.lineColor) {
		this.stroke(context, matrix);
	}
	this.debugDraw(context);
};
CAL.Shape.prototype.debugDraw = function (context) {
	context.beginPath();
	context.lineWidth = 1;

	for (var i = 0; i < this.points.length; i ++) {
		var point = this.points[i];

		point.draw(context);
	}

	context.beginPath();

	for (var i = 0; i < this.lines.length; i ++) {
		var point = this.lines[i];

		context.lineTo(point.x, point.y);
		context.arc(point.x, point.y, 2, 0, Math.PI*2, true);
		context.lineTo(point.x, point.y);
	}

	context.strokeStyle = "black";
	context.stroke();
};

CAL.Shape.prototype.getSize = function () {
	var width = 0;
	var height = 0;

	for (var i = 0; i < this.lines.length; i ++) {
		var line = this.lines[i];

		width = Math.max(width, Math.ceil(line.x));
		height = Math.max(width, Math.ceil(line.y));
	}

	return {
		width: width,
		height: height
	};
};


CAL.BezierPoint = function (position, controlPointA, controlPointB) {
	this.position = position || new CAL.Vector(0, 0);
	this.controlPointA = controlPointA || new CAL.Vector(0, 0);
	this.controlPointB = controlPointB || new CAL.Vector(0, 0);
}
CAL.BezierPoint.prototype.applyMatrix = function (matrix) {
	var position = this.position.applyMatrix(matrix);
	var controlPointA = this.controlPointA.applyMatrix(matrix);
	var controlPointB = this.controlPointB.applyMatrix(matrix);

	return new CAL.BezierPoint(position, controlPointA, controlPointB);
};
CAL.BezierPoint.prototype.draw = function (context) {
	var leftHandle = this.controlPointA.add(this.position);
	var rightHandle = this.controlPointB.add(this.position);

	context.strokeStyle = "#09F";

	context.beginPath();
	context.moveTo(leftHandle.x, leftHandle.y);
	context.lineTo(this.position.x, this.position.y);
	context.lineTo(rightHandle.x, rightHandle.y);
	context.stroke();

	context.beginPath();
	context.arc(this.position.x, this.position.y, 10, 0, Math.PI*2, true);
	context.stroke();

	context.beginPath();
	context.arc(leftHandle.x, leftHandle.y, 5, 0, Math.PI*2, true);
	context.stroke();

	context.beginPath();
	context.arc(rightHandle.x, rightHandle.y, 5, 0, Math.PI*2, true);
	context.stroke();	
};

function recursiveBezier (p1, p2, p3, p4, precision) {
	//source: http://antigrain.com/research/adaptive_bezier/
	//source: http://en.wikipedia.org/wiki/B%C3%A9zier_curve#Derivative

	var p12 = p1.add(p2).scale(0.5);
	var p23 = p2.add(p3).scale(0.5);
	var p34 = p3.add(p4).scale(0.5);
	var p123 = p12.add(p23).scale(0.5);
	var p234 = p23.add(p34).scale(0.5);
	var p1234 = p123.add(p234).scale(0.5);

	var d = p4.subtract(p1);

	var d2 = Math.abs((p2.x - p4.x) * d.y - (p2.y - p4.y) * d.x);
	var d3 = Math.abs((p3.x - p4.x) * d.y - (p3.y - p4.y) * d.x);

	//if (Math.abs(p1.x + p3.x - p2.x - p2.x) + Math.abs(p1.y + p3.y - p2.y - p2.y) + Math.abs(p2.x + p4.x - p3.x - p3.x) + Math.abs(p2.y + p4.y - p3.y - p3.y) <= precision) {
	if (Math.pow((d2 + d3), 2) < precision * d.dot(d)) {

		//var t = 0.5;
		//var derivative = (p2.subtract(p1)).scale(Math.pow(3*(1-t), 2)).add((p3.subtract(p2)).scale(6*(1-t)*t)).add((p4.subtract(p3)).scale(Math.pow(3*t, 2)));
		var derivative = (p2.subtract(p1)).scale(2.25).add((p3.subtract(p2)).scale(1.5)).add((p4.subtract(p3)).scale(2.25));

		var point = {
			x: p1234.x,
			y: p1234.y,
			angle: derivative.direction()
		}

		return [point];
	}
	else {

		return [].concat(
			recursiveBezier(p1, p12, p123, p1234, precision),
			recursiveBezier(p1234, p234, p34, p4, precision)
		);
	}
}*/

CAL.Text = function (options) {
	options = options || {};
	CAL.Matrix.call(this, options);

	this.visible = options.visible !== undefined ? options.visible : true;
	this.active = options.active !== undefined ? options.active : true;
	this.depth = options.depth || 0;
	this.text = options.text || "";
	this.style = options.style || "normal";
	this.variant = options.variant || "normal";
	this.weight = options.weight || "normal";
	this.size = options.size || 12;
	this.font = options.font || "Arial";

	this.textAlign = options.textAlign || "left";

	this.color = options.color || new CAL.Color();
	this.alpha = typeof options.alpha === "number" ? options.alpha : 1;
};
CAL.Text.prototype = Object.create(CAL.Matrix.prototype);
CAL.Text.prototype.drawText = function (context, text, x, y) {
	context.font = [this.style, this.variant, this.weight, this.size+"px", this.font].join(" ");
	context.textAlign = this.textAlign;
	this.color.setColor(context);
	context.fillText(text, x, y);
};
CAL.Text.prototype.drawTextAlpha = function (context, text, x, y, apha) {
	context.font = [this.style, this.variant, this.weight, this.size+"px", this.font].join(" ");
	context.globalAlpha = apha;
	this.color.setColor(context);
	context.fillText(text, x, y);
	context.globalAlpha = 1;
};
CAL.Text.prototype.draw = function (context, matrix) {
	context.save();
	matrix.setContext(context);
	context.globalAlpha = this.alpha;
	this.drawText(context, this.text, 0, 0);
	context.restore();
};
CAL.Text.prototype.clone = function () {
	return new CAL.text({
		style : this.style,
		variant : this.variant,
		weight : this.weight,
		size : this.size,
		font : this.font,
		color : this.color.clone()
	});
};

CAL.KeyListener = function (options) {
	options = options || {};

	this.visible = false;
	this.active = options.active !== undefined ? option.active : true;
	this.depth = -10000;

	this.actions = options.actions || {};

	CAL.Scene.add(this);
};
CAL.KeyListener.prototype.add = function (key, callback) {
	this.actions[key] = callback;
};
CAL.KeyListener.prototype.keyDown = function (key) {
	if (this.actions[key]) {
		this.actions[key]();
	}
};

CAL.Physics = function () {
	CAL.Scene.add(this);
	this.depth = -1000;
	this.active = true;
	this.visible = false;

	this.objects = [];
	this.manifolds = [];
	this.forces = [];
}
CAL.Physics.prototype.keyDown = function () {
	//DEBUG REASONS
	//EASIER TO DEBUG ON KEYDOWN

	CAL.Scene.clear();

	this.test(120);

	polygon.debugDraw(CAL.Scene.context);
	box.debugDraw(CAL.Scene.context);

};
CAL.Physics.prototype.add = function () {
	for (var i = 0; i < arguments.length; i ++) {
		var object = arguments[i];

		if (object instanceof CAL.PhysicsObject && this.objects.indexOf(object) === -1) {
			for (var j = 0; j < this.objects.length; j ++) {
				this.manifolds.push(new CAL.Manifold(object, this.objects[j]));
				this.manifolds.push(new CAL.Manifold(this.objects[j], object));
			}

			this.objects.push(object);
		}
		else if (object instanceof CAL.Force && this.forces.indexOf(object) === -1) {
			this.forces.push(object);
		}
	}
};
CAL.Physics.prototype.test = function (dt) {
	//var dt = 120;

	this.objects.foreach(function (object) {
		object.step(dt);
	}, this);

	this.forces.foreach(function (force) {
		force.step(dt);
	}, this);

	this.manifolds.foreach(function (manifold) {
		manifold.step(dt);
	}, this);

};

CAL.Manifold = function (a, b) {
	this.a = a;
	this.b = b;

	this.normal;
};
CAL.Manifold.prototype.checkCollision = function (dt) {
	var collisionData = {collision: false};

	this.b.shape.points.foreach(function (pointA, i) {
		var pointA = pointA.applyMatrix(this.b.shape);
		var collision = true;
		var bestDistance = -Infinity;
		var bestNormal;

		this.a.shape.points.foreach(function (pointB, j) {
			var pointB = pointB.applyMatrix(this.a.shape);
			var normal = this.a.shape.getNormal(j);
			var distance = normal.dot(pointA.subtract(pointB));

			if (distance > 0) {
				collision = false;
				return true;
			}
			else if (distance > bestDistance) {
				bestDistance = distance;
				bestNormal = normal;
			}
		}, this);

		if (collision) {
			collisionData = {collision: true, penetrationDepth: -bestDistance, normal: bestNormal, impactPoint: pointA};

			return true;
		}

	}, this);

	return collisionData;

	/*this.a.shape.points.foreach(function (point, i) {
		var normal = this.a.shape.getNormal(i);
		var support = this.b.getSupport(normal.scale(-1));

		var point = point.applyMatrix(this.a.shape);
		var distance = normal.dot(support.subtract(point));

		//if (distance > 0) {
		//	console.log("test");
		//	bestDistance = 1;
		//	return true;
		//}
		if (distance > bestDistance || bestDistance === false) {

			//var velocity = this.b.velocity.add(this.b.getPointVelocity(support));
			//if (velocity.dot(normal) < 0 || velocity.length === 0) {

				bestDistance = distance;
				bestNormal = normal;
				bestImpactPoint = support;
				//bestVelocity = velocity;
			//}
		}
	}, this);

	var i = 2;
	var normal = this.a.shape.getNormal(i);
	normal.scale(100).draw(CAL.Scene.context, 200, 200);
	var support = this.b.getSupport(normal.scale(-1));

	var point = this.a.shape.points[i].applyMatrix(this.a.shape);
	var distance = normal.dot(support.subtract(point));

	console.log(distance);

	CAL.Scene.context.beginPath();
	CAL.Scene.context.arc(support.x, support.y, 10, 0, Math.PI*2);
	CAL.Scene.context.stroke();

	return {collision: bestDistance < 0, penetrationDepth: bestDistance, normal: bestNormal, impactPoint: bestImpactPoint};*/
};
CAL.Manifold.prototype.positionalCorrection = function (collisionData) {
	var percent = 0.2; // usually 20% to 80%
	var slop = 0.1; // usually 0.01 to 0.1

	var correction = collisionData.normal.scale(Math.max(collisionData.penetrationDepth - slop, 0) / (1/this.a.mass + 1/this.b.mass) * percent);

	var aPos = correction.scale(1/this.a.mass);
	this.a.shape._x += aPos.x;
	this.a.shape._y += aPos.y;
	this.a.shape.updateMatrix();

	var bPos = correction.scale(1/this.b.mass);
	this.b.shape._x -= bPos.x;
	this.b.shape._y -= bPos.y;
	this.b.shape.updateMatrix();
};
CAL.Manifold.prototype.resolveCollision = function (collisionData) {
	var restVelocity = this.b.velocity.subtract(this.a.velocity);

	var velAlongNormal = restVelocity.dot(collisionData.normal);
	if (velAlongNormal > 0) {
		return;
	}
	var restitution = Math.min(this.a.restitution, this.b.restitution);

	var force = -(1 + restitution) * velAlongNormal / (1/this.a.mass + 1/this.b.mass);

	var impulse = collisionData.normal.scale(force);
	
	this.a.addForce(impulse.scale(-1), collisionData.impactPoint);
	this.b.addForce(impulse, collisionData.impactPoint);
};
CAL.Manifold.prototype.step = function (dt) {
	var collisionData = this.checkCollision();

	if (collisionData.collision) {
		this.resolveCollision(collisionData);
		this.positionalCorrection(collisionData);
	}
};

CAL.PhysicsObject = function (options) {
	options = options || {};

	this.shape = options.shape || new CAL.Shape();
	this.velocity = options.velocity || new CAL.Vector();
	this.angularVelocity = options.angularVelocity !== undefined ? options.angularVelocity : 0;
	this.restitution = options.restitution !== undefined ? options.restitution : 0.5;
	this.density = options.density || 1;
	this.updateMass();
};
CAL.PhysicsObject.prototype.calculateBoundingBox = function (matrix) {
	matrix = matrix || this.shape;

	var minX = Infinity;
	var minY = Infinity;
	var maxX = -Infinity;
	var maxY = -Infinity;
	this.shape.points.foreach(function (point) {
		var point = point.applyMatrix(matrix);

		minX = (point.x < minX) ? point.x : minX;
		minY = (point.y < minY) ? point.y : minY;
		maxX = (point.x > maxX) ? point.x : maxX;
		maxY = (point.y > maxY) ? point.y : maxY;
	}, this);

	return {minX: minX, minY: minY, maxX: maxX, maxY: maxY};
};
CAL.PhysicsObject.prototype.addForce = function (impulse, contactVector) {
	this.velocity = this.velocity.add(impulse.scale(1.0/this.mass));

	/*if (contactVector !== undefined) {
		this.angularVelocity += contactVector.subtract(this.centerOfMass.applyMatrix(this.shape)).cross(impulse)*(1.0/this.inertia);
		//this.angularVelocity = contactVector.subtract(this.centerOfMass.applyMatrix(this.shape)).cross(impulse)*(1.0/this.inertia);
	}*/
};
CAL.PhysicsObject.prototype.pointCollision = function (point) {
	var point = point
		.subtract(new CAL.Vector(this.shape.x, this.shape.y))
		.rotate(-this.shape.rotation)
		.multiply(new CAL.Vector(1/this.shape.sx, 1/this.shape.sy))
		.subtract(new CAL.Vector(this.collisionMask.offsetX, this.collisionMask.offsetY));

	if (point.x < 0) return false;
	if (point.y < 0) return false;
	if (point.x > this.collisionMask.width) return false;
	if (point.y > this.collisionMask.height) return false;

	var i = Math.round(point.y)*this.collisionMask.width + Math.round(point.x);
	return this.collisionMask.data[i];
};
CAL.PhysicsObject.prototype.setDensity = function (density) {
	this.density = density;
	this.mass = this.area*density;
	this.inertia = this.mass*this.area;
};
CAL.PhysicsObject.prototype.updateMass = function () {
	var boundingBox = this.calculateBoundingBox(new CAL.Matrix());
	var surface = new CAL.Surface({x: boundingBox.maxX - boundingBox.minX, y: boundingBox.maxY - boundingBox.minY});
	this.shape.clip(surface.context, new CAL.Matrix({x: -boundingBox.minX, y: -boundingBox.minY}));
	surface.context.fillStyle = "black";
	surface.context.fillRect(0, 0, surface.width, surface.height);

	var imageData = surface.getImageData();

	var point = new CAL.Vector();
	var area = 0;
	this.collisionMask = {
		data: [],
		width: imageData.width,
		height: imageData.height,
		offsetX: boundingBox.minX,
		offsetY: boundingBox.minY
	};
	for (var i = 0; i < imageData.data.length; i += 4) {
		var alpha = imageData.data[i + 3];
		if (alpha > 0) {
			point = point.add(new CAL.Vector(i/4 % imageData.width, Math.floor(i/4/imageData.width)));
			area ++;
			this.collisionMask.data.push(true);
		}
		else {
			this.collisionMask.data.push(false);
		}
	}
	this.area = area/**this.sx*this.sy*/;
	this.mass = area*this.density;
	this.inertia = this.mass*area;
	this.centerOfMass = point.scale(1/area).add(new CAL.Vector(boundingBox.minX, boundingBox.minY));
};
CAL.PhysicsObject.prototype.getSupport = function (n) {
	var bestProjection = -Infinity;
	var bestPoint;

	for (var i = 0; i < this.shape.points.length; i ++) {
		var point = this.shape.points[i].applyMatrix(this.shape);
		var projection = point.dot(n);

		if (projection > bestProjection) {
			bestPoint = point;
			bestProjection = projection;
		}
	}

	return bestPoint;
};
CAL.PhysicsObject.prototype.getPointVelocity = function (point) {

	var relativePoint = point.subtract(this.centerOfMass.applyMatrix(this.shape));
	var rotatedPoint = relativePoint.rotate(this.angularVelocity);

	return rotatedPoint.subtract(relativePoint);
};
CAL.PhysicsObject.prototype.findCollisionFace = function (point) {

};
CAL.PhysicsObject.prototype.step = function (dt) {
	//this.rotateAroundRelative(this.torque*dt, this.centerOfMass);

	//this.angularVelocity += torque * (1.0 / this.inertia) * dt

	/*if (this.velocity.length < 0.0001) {
		this.velocity = new CAL.Vector();
	}
	if (Math.abs(this.angularVelocity) < 0.00001) {
		this.angularVelocity = 0;
	}*/

	this.shape._x += this.velocity.x*dt;
	this.shape._y += this.velocity.y*dt;
	this.shape.updateMatrix();

	//this.shape.rotateAroundRelative(this.angularVelocity*dt, this.centerOfMass);
};

CAL.PhysicsObject.prototype.debugDraw = function (context) {
	context.lineWidth = 1;
	context.strokeStyle = "black";

	var minX = Infinity;
	var minY = Infinity;
	var maxX = -Infinity;
	var maxY = -Infinity;
	context.beginPath();
	this.shape.points.foreach(function (point) {
		var point = point.applyMatrix(this.shape);

		context.lineTo(point.x, point.y);
		context.arc(point.x, point.y, 3, 0, 2*Math.PI*2);
		context.lineTo(point.x, point.y);

		minX = (point.x < minX) ? point.x : minX
		minY = (point.y < minY) ? point.y : minY
		maxX = (point.x > maxX) ? point.x : maxX
		maxY = (point.y > maxY) ? point.y : maxY
	}, this);
	context.closePath();
	context.stroke();

	this.shape.points.foreach(function (point, i) {
		var point = point.applyMatrix(this.shape);
		var text = new CAL.Text();
		text.drawText(context, i, point.x + 10, point.y - 10);
		//this.getPointVelocity(point).scale(1000).draw(context, point.x, point.y);
	}, this);


	context.beginPath();
	context.moveTo(minX, minY);
	context.lineTo(minX, maxY);
	context.lineTo(maxX, maxY);
	context.lineTo(maxX, minY);
	context.closePath();

	var centerOfMass = this.centerOfMass.applyMatrix(this.shape);
	context.moveTo(centerOfMass.x-5, centerOfMass.y-5);
	context.lineTo(centerOfMass.x+5, centerOfMass.y+5);
	context.moveTo(centerOfMass.x+5, centerOfMass.y-5);
	context.lineTo(centerOfMass.x-5, centerOfMass.y+5);
	context.strokeStyle = "red";
	context.stroke();

	var center = this.centerOfMass.applyMatrix(this.shape);
	this.velocity.scale(1000).draw(context, center.x, center.y);
};

CAL.Force = function (options) {

	this.objects = options.objects || [];
	this.velocity = options.velocity || new CAL.Vector();
}
CAL.Force.prototype.add = function () {
	for (var i = 0; i < arguments.length; i ++) {
		var argument = arguments[i];

		this.objects.push(argument);
	}
};
CAL.Force.prototype.step = function (dt) {
	
	for (var i = 0; i < this.objects.length; i ++) {
		var object = this.objects[i];

		object.velocity = object.velocity.add(this.velocity.scale(dt));
	}
};