var plot1 = new jsGraphics("canvas1");
var plot2 = new jsGraphics("canvas2");
var plot3 = new jsGraphics("canvas3");
var plot4 = new jsGraphics("canvas4");
var plot5 = new jsGraphics("canvas5");
var plot6 = new jsGraphics("canvas6");
var plot7 = new jsGraphics("canvas7");
var numSamples = 8;
var fX = new Array(numSamples);
var xStart = 40;
var yStart = 40;
var xRange = 640;
var yRange = 210;
var yMid = (yRange+yStart)/2;
var xMid = (xRange+xStart)/2;
var xTick = (xRange-xStart) / numSamples;
var yTick1 = yStart+10;
var yTick2 = yRange-10;
var yTick3 = yMid;
var yAdj = yMid-yTick1;
var M = 15;
var hdn = new Array(M*2+1);
var wn = new Array(M*2+1);
var han = new Array(M*2+1);
var hn = new Array(M*2+1);
var fY = new Array(M*2+numSamples);
var W = 90;
var WStr = "";

function draw_plot(p, s)
{
	p.setColor("black");
	p.setStroke(2);
	p.drawLine(xStart-10,yMid,xRange,yMid);
	p.drawLine(xStart,yStart,xStart,yRange);
	
	// Ticks
	for (var n=1; n<=7; n++) {
		p.drawLine(xTick*n+xStart, yMid-2, xTick*n+xStart, yMid+2);
	}
	p.drawLine(xStart-2,yTick1,xStart+2,yTick1);
	p.drawLine(xStart-2,yTick2,xStart+2,yTick2);
	
	// Graphics
	p.setFont("verdana", "12px", Font.BOLD);
	p.drawString(s, xMid-100, yStart+10);
	p.drawString("1", xStart+10, yStart+3);
	p.drawString("-1", xStart+10, yRange-16);
	if (isNaN(W) == true) {
		WStr = "NaN";
	} else {
		WStr = W/180;
	}
	p.drawString("<font face=\"Symbol\">W</font>="+WStr+"*<font face=\"Symbol\">p</font>", xRange-50, yStart+10);	
		
	p.paint();
}

function draw_plot2(p, s)
{
	p.setColor("black");
	p.setStroke(2);
	p.drawLine(xStart,yRange,xRange,yRange);
	p.drawLine(xMid,yStart,xMid,yRange+10);
	
	// Ticks
	p.drawLine(xMid-2,yMid-50,xMid+2,yMid-50);
	p.drawLine(xStart+30,yRange-2,xStart+30,yRange+2);
	p.drawLine(xRange-30,yRange-2,xRange-30,yRange+2);
	p.drawLine(xMid-75,yRange-2,xMid-75,yRange+2);
	p.drawLine(xMid+75,yRange-2,xMid+75,yRange+2);
	
	// Graphics
	p.setFont("verdana", "12px", Font.BOLD);
	p.drawString(s, xMid+10, yStart+10);
	p.drawString("-<font face=\"Symbol\">p</font>", xStart+23, yRange+10);
	p.drawString("<font face=\"Symbol\">p</font>", xRange-37, yRange+10);
	p.drawString("-<font face=\"Symbol\">W</font><sub>1</sub>", xMid-85, yRange+10);
	p.drawString("<font face=\"Symbol\">W</font><sub>1</sub>", xMid+69, yRange+10);
	p.drawString("1", xMid+85, yMid-56);
	p.drawString("<font face=\"Symbol\">W</font><sub>1</sub> = <font face=\"Symbol\">p</font>/8", xMid+150, yMid);
	
	p.paint();
	
	// Graph itself
	p.setStroke(3);
	p.drawLine(xStart,yRange,xMid-75,yRange);
	p.drawLine(xMid-75,yRange,xMid-75,yMid-50);
	p.drawLine(xMid-75,yMid-50,xMid+75,yMid-50);
	p.drawLine(xMid+75,yMid-50,xMid+75,yRange);
	p.drawLine(xMid+75,yRange,xRange,yRange);
	
	p.paint();
}

function draw_plot3(p, s)
{
	var yA = (yMid-(yStart+10)) * 8;
	var xT = (xRange-xStart)/(2*M);
	
	p.setColor("black");
	p.setStroke(2);
	p.drawLine(xStart,yMid,xRange,yMid);
	p.drawLine(xMid,yStart,xMid,yRange+10);
	
	// Ticks
	for (var i=0; i<=(2*M); i++) {
		p.drawLine(xStart+i*xT,yMid-2,xStart+i*xT,yMid+2);
		hdn[i] = Math.sin((i-15) * (Math.PI / 8)) / ((i-15) * Math.PI);
	}
	hdn[15] = 1/8;
	p.drawLine(xMid-2,yStart+10,xMid+2,yStart+10);
	p.drawLine(xMid-2,yRange-10,xMid+2,yRange-10);
	
	// Graphics
	p.setFont("verdana", "12px", Font.BOLD);
	p.drawString(s, xMid-100, yStart+10);
	p.drawString("0.125", xMid+10, yStart-5);
	p.drawString("-0.125", xMid+10, yRange-16);	
	
	p.paint();

	// Graph itself	
	p.setStroke(3);
	for (var i=0; i<=(2*M); i++) {
		p.drawLine(xStart+i*xT,yMid,xStart+i*xT,yMid - (yA*hdn[i]));
		p.fillEllipse(xStart+i*xT - 3, yMid - (yA*hdn[i]+3), 8, 8);
	}	
	p.paint();
}

function draw_plot4(p, s)
{
	var yA = (yMid-(yStart+10)) * 8;
	var xT = (xRange-xStart)/(2*M);
	
	p.setColor("black");
	p.setStroke(2);
	p.drawLine(xStart,yMid,xRange,yMid);
	p.drawLine(xMid,yStart,xMid,yRange+10);
	
	// Ticks
	for (var i=0; i<=(2*M); i++) {
		p.drawLine(xStart+i*xT,yMid-2,xStart+i*xT,yMid+2);
	}
	p.drawLine(xMid-2,yStart+10,xMid+2,yStart+10);
	p.drawLine(xMid-2,yRange-10,xMid+2,yRange-10);
	
	// Graphics
	p.setFont("verdana", "12px", Font.BOLD);
	p.drawString(s, xMid-100, yStart+10);
	p.drawString("0.125", xMid+10, yStart-5);
	p.drawString("-0.125", xMid+10, yRange-16);	
	
	p.paint();

	// Graph itself
	p.setStroke(3);
	for (var i=0; i<=(2*M); i++) {
		wn[i] = 0.54 + (0.46 * Math.cos(((i-15) * Math.PI) / M));
		han[i] = wn[i] * hdn[i];
		p.drawLine(xStart+i*xT,yMid,xStart+i*xT,yMid - (yA*han[i]));
		p.fillEllipse(xStart+i*xT - 3, yMid - (yA*han[i]+3), 8, 8);
	}	
	p.paint();
}

function draw_plot5(p, s)
{
	var yA = (yMid-(yStart+10)) * 8;
	var xT = (xRange-xStart)/(2*M);
	
	p.setColor("black");
	p.setStroke(2);
	p.drawLine(xStart-10,yMid,xRange,yMid);
	p.drawLine(xStart,yStart,xStart,yRange+10);
	
	// Ticks
	for (var i=0; i<=(2*M); i++) {
		p.drawLine(xStart+i*xT,yMid-2,xStart+i*xT,yMid+2);
	}
	p.drawLine(xStart-2,yStart+10,xStart+2,yStart+10);
	p.drawLine(xStart-2,yRange-10,xStart+2,yRange-10);
	
	// Graphics
	p.setFont("verdana", "12px", Font.BOLD);
	p.drawString(s, xStart+100, yStart+10);
	p.drawString("0.125", xStart+10, yStart+3);
	p.drawString("-0.125", xStart+10, yRange-16);	
	
	p.paint();

	// Graph itself
	p.setStroke(3);
	for (var i=0; i<=(2*M); i++) {
		hn[i] = han[i] * Math.cos(((i-15)*Math.PI)/2);
		p.drawLine(xStart+i*xT,yMid,xStart+i*xT,yMid - (yA*hn[i]));
		p.fillEllipse(xStart+i*xT - 3, yMid - (yA*hn[i]+3), 8, 8);
	}	
	p.paint();
}

function draw_plot6(p, s)
{
	var xT = (xRange-xStart)/(2*M+numSamples);
	
	p.setColor("black");
	p.setStroke(2);
	p.drawLine(xStart-10,yMid,xRange,yMid);
	p.drawLine(xStart,yStart,xStart,yRange);
	
	// Ticks
	for (var n=1; n<(2*M+numSamples); n++) {
		p.drawLine(xT*n+xStart, yMid-2, xT*n+xStart, yMid+2);
	}
	p.drawLine(xStart-2,yTick1,xStart+2,yTick1);
	p.drawLine(xStart-2,yTick2,xStart+2,yTick2);
	
	// Graphics
	p.setFont("verdana", "12px", Font.BOLD);
	p.drawString(s, xMid-100, yStart+10);
	p.drawString("0.5", xStart+10, yStart+3);
	p.drawString("-0.5", xStart+10, yRange-16);
	if (isNaN(W) == true) {
		WStr = "NaN";
	} else {
		WStr = W/180;
	}
	p.drawString("<font face=\"Symbol\">W</font>="+WStr+"*<font face=\"Symbol\">p</font>", xRange-50, yStart+10);	
		
	p.paint();
}

function draw_plot7(p, s)
{
	var xT = (xRange-xStart)/numSamples;
	
	p.setColor("black");
	p.setStroke(2);
	p.drawLine(xStart-10,yRange-10,xRange,yRange-10);
	p.drawLine(xStart,yStart,xStart,yRange);
	
	// Ticks
	for (var n=1; n<numSamples; n++) {
		p.drawLine(xT*n+xStart, yRange-12, xT*n+xStart, yRange-8);
	}
	p.drawLine(xStart-2,yTick1,xStart+2,yTick1);
	p.drawLine(xStart-2,yTick3,xStart+2,yTick3);
	
	// Graphics
	p.setFont("verdana", "12px", Font.BOLD);
	p.drawString(s, xMid-100, yStart+10);
	p.drawString("4", xStart+10, yStart+3);
	p.drawString("2", xStart+10, yTick3-5);
	if (isNaN(W) == true) {
		WStr = "NaN";
	} else {
		WStr = W/180;
	}
	p.drawString("<font face=\"Symbol\">W</font>="+WStr+"*<font face=\"Symbol\">p</font>", xRange-50, yStart+10);	
		
	p.paint();
}

function plot_graph1()
{
	var form1 = document.forms[0];
	W = parseFloat(form1.W.value);

	plot1.clear();
	draw_plot(plot1, "x[n]");
	
	if (isNaN(W) == true) {
		plot1.setFont("verdana", "10px", Font.BOLD);
		plot1.drawString("BAD VALUE for Phase", xStart+100, yStart+20);
		plot1.paint();
	} else {
		W = (W * Math.PI) / 180;
		plot1.setColor("black");
		plot1.setStroke(3);
		for (var n=0; n<numSamples; n++) {
			fX[n] = Math.cos(W*n);
			plot1.drawLine(xTick*n+xStart, yMid, xTick*n+xStart, yMid - (yAdj*fX[n]));
			plot1.fillEllipse(xTick*n+xStart - 3, yMid - (yAdj*fX[n] + 3), 8, 8);
		}
		plot1.paint();
	}	
}

function phase_change(w)
{
	W = parseFloat(w);
	
	if (isNaN(W) == false) {
		var form1 = document.forms[0];
		form1.W.value = W;
		plot_all_graphs();
	}
}

function plot_graph2()
{
	var x = 0;
	var xT = (xRange-xStart)/(2*M+numSamples);
	var form1 = document.forms[0];
	W = parseFloat(form1.W.value);
	var yA = yAdj * 2;

	plot6.clear();
	draw_plot6(plot6, "y[n]");

	if (isNaN(W) == true) {
		plot6.setFont("verdana", "10px", Font.BOLD);
		plot6.drawString("BAD VALUE for Phase", xStart+100, yStart+20);
		plot6.paint();
	} else {
		W = (W * Math.PI) / 180;
		plot6.setColor("black");
		plot6.setStroke(3);
		for (var n=0; n<(2*M+numSamples); n++) {
			fY[n] = 0;
			for (var k=0; k<=(2*M); k++) {
				if ((n-k) < 0) x = 0;
				else if ((n-k) > 7) x = 0;
				else {
					x = fX[n-k];
					fY[n] += (hn[k] * x);
				}
			}
			plot6.drawLine(xT*n+xStart, yMid, xT*n+xStart, yMid - (yA*fY[n]));
			plot6.fillEllipse(xT*n+xStart - 3, yMid - (yA*fY[n] + 3), 8, 8);
		}
		plot6.paint();
	}	
}

function plot_graph3()
{
	var xT = (xRange-xStart)/numSamples;
	var form1 = document.forms[0];
	W = parseFloat(form1.W.value);
	var yA = yAdj / 2;
	
	var XReal = new Array(numSamples);
	var XImg = new Array(numSamples);
	var C = new Array(numSamples);
	var S = new Array(numSamples);
	var Xk = new Array(numSamples);
	var k = 0;
	var LIM1 = 0;
	var LIM2 = 0;
	var n = 0;
	var arg = 0;
	var B1 = 0;
	var B2 = 0;
	var C1 = 0;
	var C2 = 0;
	var COS1 = 0;
	var SIN1 = 0;
	var X1 = 0;
	var X2 = 0;
	
	plot7.clear();
	draw_plot7(plot7, "|X[k]|");
	
	if (isNaN(W) == true) {
		plot7.setFont("verdana", "10px", Font.BOLD);
		plot7.drawString("BAD VALUE for Phase", xStart+100, yStart+20);
		plot7.paint();
	} else {
		// Zero out Real and Imaginary Parts
		// Swap input data
		for (n=0; n<numSamples; n++) {
			XReal[n] = 0;
			XImg[n] = 0;
			k = 0;
			if ((n%2)==1) k += 4;
			if (((n>>>1)%2)==1) k += 2;
			if (((n>>>2)%2)==1) k += 1;
			XReal[k] = fX[n];
		}
		// Do calculations
		for (var stage=0; stage<3; stage++) {
			LIM1 = Math.pow(2, stage);
			LIM2 = Math.pow(2, 2-stage);
			for (var L=0; L<LIM2; L++) {
				for (var R=0; R<LIM1; R++) {
					n = R+(L*2*LIM1);
					B1 = XReal[n];
					B2 = XImg[n];
					C1 = XReal[n+LIM1];
					C2 = XImg[n+LIM1];
					arg = (Math.PI * 2 * R * LIM2) / numSamples;
					COS1 = Math.cos(arg);
					SIN1 = Math.sin(arg);
					X1 = C1*COS1+C2*SIN1;
					X2 = C2*COS1-C1*SIN1;
					XReal[n] = B1 + X1;
					XImg[n] = B2 + X2;
					XReal[n+LIM1] = B1 - X1;
					XImg[n+LIM1] = B2 - X2;
				}
			}			
		}
		// Finish by calculating Xk[n] and plotting
		for (n=0; n<numSamples; n++) {
			Xk[n] = Math.sqrt(Math.pow(XReal[n],2) + Math.pow(XImg[n],2));
			plot7.drawLine(xT*n+xStart, yRange-10, xT*n+xStart, yRange - (yA*Xk[n]) - 10);
			plot7.fillEllipse(xT*n+xStart - 3, yRange - (yA*Xk[n] + 3) - 10, 8, 8);
		}
		plot7.paint();
	}	
}

function plot_all()
{
	plot_graph1();

	plot2.clear();
	draw_plot2(plot2,"H(<font face=\"Symbol\">W</font>)");
	
	plot3.clear();
	draw_plot3(plot3,"h<sub>d</sub>[n]");
	
	plot4.clear();
	draw_plot4(plot4,"h<sub>a</sub>[n]");
	
	plot5.clear();
	draw_plot5(plot5,"h<sub>a</sub>[n]");
	
	plot_graph2();
	plot_graph3();
}

function plot_all_graphs()
{
	plot_graph1();
	plot_graph2();
	plot_graph3();
}