function Canvas( w, h )
{
	var q = document.createElement( 'canvas' );
	if (typeof q.getContext != 'function')
		return;
	this.htmlElement = q;
	this.context = this.htmlElement.getContext('2d');
	this.htmlElement.width = w;
	this.htmlElement.height = h;
	this.width = w;
	this.height = h;
	this.context.strokeStyle = 'rgb(0, 0, 0)';
}

Canvas.prototype = new Object;

Canvas.prototype.clear = function( color )
{
	if (color)
		this.context.fillStyle = 'rgb( 1, 1, 1 )';
	else
		this.context.fillStyle = 'rgba( 255, 255, 255, 1 )';
	this.context.fillRect( 0, 0, 200, 200 ); // this.width, this.height );
}

Canvas.prototype.drawLine = function( x1, y1, x2, y2, color )
{
	if (color)
		this.context.strokeStyle = 'rgba(0, 0, 0, 1)';
	this.context.beginPath();
	this.context.moveTo( x1, y1 );
	this.context.lineTo( x2, y2 );
	this.context.stroke();
}

Canvas.prototype.drawCurve = function( x1, y1, x2, y2, x3, y3, x4, y4, color )
{
	if (color)
		this.context.strokeStyle = 'rgba(0, 0, 0, 1)';
	this.context.beginPath();
	this.context.moveTo( x1, y1 );
	this.context.bezierCurveTo( x2, y2, x3, y3, x4, y4 );
	this.context.stroke();
}

Canvas.prototype.moveTo = function( x1, y1 )
{
	this.context.moveTo( x1, y1 );
}

Canvas.prototype.lineTo = function( x1, y1 )
{
	this.context.lineTo( x1, y1 );
}

Canvas.prototype.curveTo = function( x1, y1, x2, y2, x3, y3 )
{
	this.context.bezierCurveTo( x1, y1, x2, y2, x3, y3 );
}

Canvas.prototype.arc = function( x, y, r, a1, a2, cw )
{
	this.context.arc( x, y, r, a1, a2, cw );
}

Canvas.prototype.beginPath = function()
{
	this.context.beginPath();
}

Canvas.prototype.stroke = function()
{
	this.context.stroke();
}

Canvas.prototype.fill = function()
{
	this.context.fill();
}

Canvas.prototype.draw = function( drawable )
{
	drawable.drawToCanvas( this );
}

Canvas.prototype.setStroke = function( r, g, b, a )
{
	this.context.strokeStyle = 'rgba( ' + Math.floor(r * 255) + ', ' + Math.floor(g * 255) + ', ' + Math.floor(b * 255) + ', ' + a + ' )';
}

Canvas.prototype.setFill = function( r, g, b, a )
{
	this.context.fillStyle = 'rgba( ' + Math.floor(r * 255) + ', ' + Math.floor(g * 255) + ', ' + Math.floor(b * 255) + ', ' + a + ' )';
}