if (document.createElement('canvas').getContext) {

CanvasRenderingContext2D.prototype.dashedLine = function(x1, y1, x2, y2, dashLen) {
    if (dashLen == undefined) dashLen = 2;
    
    this.beginPath();
    this.moveTo(x1, y1);
    
    var dX = x2 - x1;
    var dY = y2 - y1;
    var dashes = Math.floor(Math.sqrt(dX * dX + dY * dY) / dashLen);
    var dashX = dX / dashes;
    var dashY = dY / dashes;
    
    var q = 0;
    while (q++ < dashes) {
     x1 += dashX;
     y1 += dashY;
     this[q % 2 == 0 ? 'moveTo' : 'lineTo'](x1, y1);
    }
    this[q % 2 == 0 ? 'moveTo' : 'lineTo'](x2, y2);
    this.strokeStyle = '#0055AB';
 	this.lineWidth = '2.5';
    this.stroke();
    this.closePath();
};

var canvas;

function drawCanvas(){
	$$('.line-lr').each(function(canvas){
	canvas = $(canvas.id);
	dim = canvas.getDimensions();
	context = canvas.getContext("2d");
	context.dashedLine(0,0,dim.width,dim.height,8);
	});
	$$('.line-rl').each(function(canvas){
	dim = canvas.getDimensions();
	context = canvas.getContext("2d");
	context.dashedLine(dim.width,0,0,dim.height,8);
	});
}

}