function supports_canvas() {
  return !!document.createElement('canvas').getContext;
}
window.onload = function(){
	if (supports_canvas()) {
		var logoKin = new Kinetic_2d("logo_c");
		var logoCtx = logoKin.getContext('2d');
		var overTopLeft = false;
		var overTopRight = false;
		var overLeft = false;
		var overRight = false;
		var overBottomLeft = false;
		var overBottomRight = false;
		logoCtx.canvas.width = 78;
		logoCtx.canvas.height = 90;
		
		function drawBack() {
            logoCtx.beginPath();
            logoCtx.lineWidth = 2;
            logoCtx.strokeStyle = "white";
            logoCtx.moveTo(1, 23);
            logoCtx.lineTo(38, 1);
            logoCtx.lineTo(75, 23);
            logoCtx.lineTo(75, 66);
            logoCtx.lineTo(38, 87);
            logoCtx.lineTo(1, 66);
            logoCtx.closePath();
            logoCtx.stroke();

            logoCtx.beginPath();
            logoCtx.lineWidth = 2;
            logoCtx.strokeStyle = "white";
            logoCtx.moveTo(38, 1);
            logoCtx.lineTo(38, 87);
            logoCtx.closePath();
            logoCtx.stroke();

            logoCtx.beginPath();
            logoCtx.lineWidth = 3;
            logoCtx.strokeStyle = "white";
            logoCtx.moveTo(1, 23);
            logoCtx.lineTo(75, 66);
            logoCtx.closePath();
            logoCtx.stroke();
			
            logoCtx.beginPath();
            logoCtx.lineWidth = 3;
            logoCtx.strokeStyle = "white";
            logoCtx.moveTo(75, 23);
            logoCtx.lineTo(1, 66);
            logoCtx.closePath();
            logoCtx.stroke();
		}
		
		function drawTopLeft() {
            logoCtx.beginPath();
            logoCtx.lineWidth = 2;
			if (overTopLeft) {
	            logoCtx.strokeStyle = "white";
	            logoCtx.fillStyle = "white";
			} else {
	            logoCtx.strokeStyle = "black";
	            logoCtx.fillStyle = "black";
			}
            logoCtx.moveTo(4, 23);
            logoCtx.lineTo(36, 4);
            logoCtx.lineTo(36, 41);
            logoCtx.closePath();
            logoCtx.fill();
            logoCtx.stroke();
		}

		function drawTopRight() {
            logoCtx.beginPath();
            logoCtx.lineWidth = 2;
			if (overTopRight) {
	            logoCtx.strokeStyle = "white";
	            logoCtx.fillStyle = "white";
			} else {
	            logoCtx.strokeStyle = "black";
	            logoCtx.fillStyle = "black";
			}
            logoCtx.moveTo(72, 23);
            logoCtx.lineTo(40, 4);
            logoCtx.lineTo(40, 41);
            logoCtx.closePath();
            logoCtx.fill();
            logoCtx.stroke();
		}

		function drawRight() {
            logoCtx.beginPath();
            logoCtx.lineWidth = 2;
			if (overRight) {
	            logoCtx.strokeStyle = "white";
	            logoCtx.fillStyle = "white";
			} else {
	            logoCtx.strokeStyle = "black";
	            logoCtx.fillStyle = "black";
			}
            logoCtx.moveTo(3, 26);
            logoCtx.lineTo(35, 44);
            logoCtx.lineTo(3, 63);
            logoCtx.closePath();
            logoCtx.fill();
            logoCtx.stroke();
		}

		function drawLeft() {
            logoCtx.beginPath();
            logoCtx.lineWidth = 2;
			if (overLeft) {
	            logoCtx.strokeStyle = "white";
	            logoCtx.fillStyle = "white";
			} else {
	            logoCtx.strokeStyle = "black";
	            logoCtx.fillStyle = "black";
			}
            logoCtx.moveTo(73, 26);
            logoCtx.lineTo(41, 44);
            logoCtx.lineTo(73, 63);
            logoCtx.closePath();
            logoCtx.fill();
            logoCtx.stroke();
		}

		function drawBottomLeft() {
            logoCtx.beginPath();
            logoCtx.lineWidth = 2;
			if (overBottomLeft) {
	            logoCtx.strokeStyle = "white";
	            logoCtx.fillStyle = "white";
			} else {
	            logoCtx.strokeStyle = "black";
	            logoCtx.fillStyle = "black";
			}
            logoCtx.moveTo(4, 66);
            logoCtx.lineTo(36, 47);
            logoCtx.lineTo(36, 84);
            logoCtx.closePath();
            logoCtx.fill();
            logoCtx.stroke();
		}

		function drawBottomRight() {
            logoCtx.beginPath();
            logoCtx.lineWidth = 2;
			if (overBottomRight) {
	            logoCtx.strokeStyle = "white";
	            logoCtx.fillStyle = "white";
			} else {
	            logoCtx.strokeStyle = "black";
	            logoCtx.fillStyle = "black";
			}
            logoCtx.moveTo(72, 66);
            logoCtx.lineTo(40, 47);
            logoCtx.lineTo(40, 84);
            logoCtx.closePath();
            logoCtx.fill();
            logoCtx.stroke();
		}

        logoKin.setDrawStage(function(){
            logoKin.clear();
			drawBack();
            logoKin.beginRegion();
			drawTopLeft();
            logoKin.addRegionEventListener("mouseover", function(){
                overTopLeft = true;
				overTopRight = false;
				overLeft = false;
				overRight = false;
				overBottomLeft = false;
				overBottomRight = false;
				drawTopLeft();
            });
            logoKin.addRegionEventListener("mouseout", function(){
                overTopLeft = false;
				drawTopLeft();
            });
            logoKin.closeRegion();
			
			
            logoKin.beginRegion();
			drawTopRight();
            logoKin.addRegionEventListener("mouseover", function(){
                overTopRight = true;
				overTopLeft = false;
				overLeft = false;
				overRight = false;
				overBottomLeft = false;
				overBottomRight = false;
				drawTopRight();
            });
            logoKin.addRegionEventListener("mouseout", function(){
                overTopRight = false;
				drawTopRight();
            });
            logoKin.closeRegion();
			

            logoKin.beginRegion();
			drawLeft();
            logoKin.addRegionEventListener("mouseover", function(){
                overLeft = true;
				overTopLeft = false;
				overTopRight = false;
				overRight = false;
				overBottomLeft = false;
				overBottomRight = false;
				drawLeft();
            });
            logoKin.addRegionEventListener("mouseout", function(){
                overLeft = false;
				drawLeft();
            });
            logoKin.closeRegion();
			
			
            logoKin.beginRegion();
			drawRight();
            logoKin.addRegionEventListener("mouseover", function(){
                overRight = true;
				overTopLeft = false;
				overTopRight = false;
				overLeft = false;
				overBottomLeft = false;
				overBottomRight = false;
				drawRight();
            });
            logoKin.addRegionEventListener("mouseout", function(){
                overRight = false;
				drawRight();
            });
            logoKin.closeRegion();
			

            logoKin.beginRegion();
			drawBottomLeft();
            logoKin.addRegionEventListener("mouseover", function(){
                overBottomLeft = true;
				overTopLeft = false;
				overTopRight = false;
				overLeft = false;
				overRight = false;
				overBottomRight = false;
				drawBottomLeft();
            });
            logoKin.addRegionEventListener("mouseout", function(){
                overBottomLeft = false;
				drawBottomLeft();
            });
            logoKin.closeRegion();
			
			
            logoKin.beginRegion();
			drawBottomRight();
            logoKin.addRegionEventListener("mouseover", function(){
                overBottomRight = true;
				overTopLeft = false;
				overTopRight = false;
				overLeft = false;
				overRight = false;
				overBottomLeft = false;
				drawBottomRight();
            });
            logoKin.addRegionEventListener("mouseout", function(){
                overBottomRight = false;
				drawBottomRight();
            });
            logoKin.closeRegion();
			

		});
	}
}