// Canvas / VML based Harmonograph
// Copyright, Per Swantesson 2010
// This is not open source, but you are welcome to contact me for use:
// http://swantesson.com/contact.html


	var speed;
	//Get Canvas Element  
	var activeCanvas;
	var canvas1
	var ctx1,ctx2;
	var xscale,yscale,xscale2,yscale2;
	var xoff,yoff;
	var xfreq,yfreq,xfreq2,yfreq2;
	var loop,damp,quality,thickness,completeness,anim;
	var ctx, performanceFactor;
	var browserIsTooSlow = false;
	
	//Init mouse tracking
	var mouseX = 0;
	var mouseY = 0;

$(document).ready(function() {
	canvas = document.getElementById("canvas1");

	if ($.browser.msie) {
		canvas=window.G_vmlCanvasManager.initElement(canvas);
	}
	if (typeof window.G_vmlCanvasManager!="undefined") { 
		canvas=window.G_vmlCanvasManager.initElement(canvas);
	}

	ctx = canvas.getContext("2d");
	init();
});

 function init() { 
	speed = 30;
	 //Get Canvas Element  
	activeCanvas=1;
	xscale,yscale,xoff,yoff,xfreq,yfreq,loop,damp;
	canvas1 = document.getElementById("canvas1");
	ctx1 = canvas1.getContext("2d");
	xscale= document.getElementById("xscale").value;
	yscale= document.getElementById("yscale").value;
	xscale2= document.getElementById("xscale2").value;
	yscale2= document.getElementById("yscale2").value;
	xoff= document.getElementById("xoffset").value;
	yoff= document.getElementById("yoffset").value;
	xfreq= document.getElementById("xfreq").value;
	yfreq= document.getElementById("yfreq").value;
	xfreq2= document.getElementById("xfreq2").value;
	yfreq2= document.getElementById("yfreq2").value;
	loop= document.getElementById("loop").value;
	damp= document.getElementById("damp").value;
	quality= document.getElementById("quality").value;
	thickness = document.getElementById("thickness").value;
	completeness= document.getElementById("completeness").value;
	anim = 0;


    //Set Refresh Rate  
    setInterval(draw, speed);

	$().mousemove(function(e){
      mouseX=e.pageX;
	  mouseY=e.pageY;
   });

 }

 function draw() {
	if (browserIsTooSlow){
		return;
	}
	//Init mouse tracking
	anim++;
	if (anim>5000){anim = 1;}
	ctx.clearRect(0,0,1000,1000);
	ctx.lineWidth=thickness;
	ctx.strokeStyle='#9db4b9';
	ctx.beginPath();
	ctx.moveTo(getX(90+anim),getY(1));

	if (anim==1){
		starttime=new Date();
	}

	if (anim==2){
		starttime=new Date();
	}

	for (var a=1+(loop-(loop*completeness/100));a<loop ;a=a+parseInt(quality) ){
		ctx.lineTo(getX(a+90+anim),getY(a));
	}
	ctx.stroke();

	if (anim==1){
	// Adjust the animation to the CPU and browser's performance
		endtime=new Date();
		totaltime=endtime-starttime;
		performanceFactor = 25/totaltime;
		if (performanceFactor < 0.25){
			browserIsTooSlow = true;
			ctx.clearRect(0,0,1000,1000);
		}
		loop=loop*performanceFactor;
		//console.log(totaltime);
	}

}
function getY(a){
	return ((dampen(a,loop))*(sin(a*yfreq-(mouseX/3))*yscale+sin(a*yfreq2)*yscale2)+parseInt(yoff));
//	return (sin(a*yfreq)*yscale+parseInt(yoff));
}

// Börja med 2.7 (som ger 1) och gå ner mot 1 (som ger 0)
function getX(a){
//	return ((dampen(a,loop))*sin(a*xfreq)*xscale+parseInt(xoff));
	return ((dampen(a,loop))*(sin(a*xfreq)*xscale+sin(a*xfreq2)*xscale2)+parseInt(xoff));
//	return (easeInOut(0,10,loop,a,damp)*sin(a*xfreq)*xscale+parseInt(xoff));
//	return (sin(a*yfreq)*yscale+parseInt(yoff));
}

function sin(a){
	return Math.sin(getRadian(a));
}

function getRadian(deg) {
	// return deg in radians
	return Math.PI * deg / 180	;
}

function dampen(currentStep,totalsteps){
	//damp = sin(90-(90/totalsteps*currentStep));// Dämpar mot ytterkanterna
	damp = sin(90/totalsteps*currentStep)-1;// Dämpar mot mitten
	//console.log(dampen);
	return damp;
}


function getMouseXY(e) {
	if (IE) { // grab the x-y pos.s if browser is IE
		tempX = event.clientX + document.body.scrollLeft;
		tempY = event.clientY + document.body.scrollTop;
	}
	else {  // grab the x-y pos.s if browser is non IE
		tempX = e.pageX;
		tempY = e.pageY;
	}  
	if (tempX < 0){tempX = 0;}
	if (tempY < 0){tempY = 0;}  
	document.Show.MouseX.value = tempX;
	document.Show.MouseY.value = tempY;
	return true;
}