// ***************** COPYRIGHT (c) 2008 STEFAN WANER ******************
// *********************** ALL RIGHTS RESERVED ************************



var theActions = new Array();
var canvas, theCanvas, ctx; // for manipulating the current canvas

var numberTesting = 0;
var numTesting2 = 0;

var jsPuttingXLabels = false; // special flag that allows user labels under the graph area.

function grapher(name, width, height, bColor, clickAction, xyCoords) {
// format: "graphFunction",function_string, color
// format "plotPoints",number,x1,y1,...,xn,yn,color


this.canvaslabel = name + "Canvas"; // name of the canvas tag
this.id = name;


this.numX = width;
this.numY = height;
this.showCoords = 1;
try {this.showCoords = xyCoords} catch(error){}
this.edgeBuffer = 10; // overflow for labels
this.borderColor = bColor;
this.xAxis = "on";
this.yAxis = "on";
this.xGrid = "on";
this.yGrid = "on";
this.xLabels = []; // should match gridline positions
this.xLabelsBelow = false;
this.yLabelsLeft = false;
this.yLabelMargin = this.edgeBuffer;
this.xLabelMargin = 0;
this.tag = graphTag(this.canvaslabel, this.id, this.numX, this.numY, this.borderColor, this.edgeBuffer, clickAction, this.showCoords);
this.pointsColor = "purple";
this.action = doActions;
this.clicked = false;
this.slope = ""; // will be the line created by the user 
this.intercept = "";
this.window = [-10, 10, -10, 10];
this.xActual = ""; // coordinates of cursor on graph
this.yActual = "";
this.xScreen = ""; // screen coordinates of cursor on graph
this.yScreen = "";
this.xClicked = ""; // screen coordinates of cursor on graph when clicked
this.yClicked = "";
this.xPrev = ""; 
this.yPrev = "";
this.actionsList = new Array(); // will be an array of actions described below
this.xGridStep = 1;
this.yGridStep = 1;
this.plottedPointsX = [0];
this.plottedPointsY = [0];
this.plottedCurves = []; 
	// a plotted curve is an array [string, xMin, xMax,"dot/circle","dot/circle"]
	// the last are for the end-point decorations.
this.curvesColors = ["teal","darkviolet","green","coral", "purple","aqua","blue","red","grey"]
this.pointsPerCurve = 1.5*(this.numY + this.numX); 
this.minDetlaXFactor = .00001; 
	// fraction of window for smallest Æx used in adaptiveSegment
this.adaptive = false; // permits adaptiveSegment
this.bars = [];
	// a bar is an array xCoords, yCoords, delta1, delta2, color, opacity
	// x coords of the bar are [x-detla1, x+delta2]
	// opacity = -1 means pure white;
this.gridColor = "aqua";
this.showScalex = true;
this.showScaley = true;
this.showEveryx = 1; // allows a tick mark on every 1 grid line
this.showEveryy = 1;
this.startTicksx = 1; // start counting at first
this.startTicksy = 1;
this.Misc = [0, 0, 0, 0] // store miscellaneous properties here
this.MiscVal = [0, 0, 0, 0];
this.MiscLogic = [false, false, false, false];
}


function graphTag(name, theId, width, height, col, edgeBuff, clickAction, showCoords) {
if (showCoords == 0) theString = '<canvas id='+ name + ' width="' + parseInt(width + edgeBuff) +  '" height="' + height + '" style = "{ cursor: crosshair;}" onclick= "' + clickAction + '"></canvas><div id = traceCoords' + theId + ' style = "{color: darkred}"> &nbsp; &nbsp; </div>';
else theString = '<canvas id='+ name + ' width="' + parseInt(width + edgeBuff) +  '" height="' + height + '" style = "{ cursor: crosshair;}" onmousemove="alertCoord(arguments[0], ' + theId + ',2)" onclick= "' + clickAction + '"></canvas><div id = traceCoords' + theId + ' style = "{color: darkred}"> &nbsp; &nbsp; </div>';
// alert(theString);
document.writeln(theString);
return(theString);
}

function doActions() {

}//


function putBars(theGraph, showLabels, labelType) {
var labelOffsetPosition = 7; 
var numBarGraphs = theGraph.bars.length;
// alert(numBarGraphs);
for (var n = 0; n<= numBarGraphs-1; n++) {
	var h1 = theGraph.bars[n][2];
	var h2 = theGraph.bars[n][3];
	var theColor = theGraph.bars[n][4];
	var theOpacity = theGraph.bars[n][5];
	var theXBarCoords = theGraph.bars[n][0];
	var theYBarCoords = theGraph.bars[n][1];

	var x1, y1, x2, yLower;
//alert(theXBarCoords);
	for (var i = 0; i <= theXBarCoords.length-1; i++) { 
//alert(i);
		x1 = theXBarCoords[i];
		y1 = theYBarCoords[i];
		yLower = theGraph.window[2];
		putBar(theGraph , x1- h1, x1+h2, yLower, y1, theColor, theOpacity);

		if (showLabels) {
// alert(x1 + "," + y1);
			var theStr = '';
			var xPlacement = x1 + (h2-h1)/2; // center of bar
			if (labelType == "y") theStr = y1.toString();
			else theStr = "(" + x1.toString() + ", " + y1.toString() + ")";
			if (y1 < 0) labelOffsetPosition = - labelOffsetPosition - 8;
			putText(theGraph, theStr, xPlacement,y1, 0, labelOffsetPosition)
			} // showLables
		} // i
	} // n

		

}


function plotPoints(theGraph, type, showLabels, labelType) { 
// labelType = '' gives (x, y) (default)
// labelType = 'y' gives y coord only
var labelOffsetPosition = 7; 
var theColor = theGraph.pointsColor;
if (!(type == "-")){
	// plot x's
	for (var i = 1; i <= theGraph.plottedPointsX.length-1; i++) {
		putX(theGraph, parseFloat(theGraph.plottedPointsX [i]), parseFloat(theGraph.plottedPointsY [i]), theGraph.pointsColor);
		} // i points
	} // has x's 
	
	var x1, x2, y1, y2;
	x1 = theGraph.plottedPointsX [1]; y1 = theGraph.plottedPointsY [1];
	var numPts = theGraph.plottedPointsX.length-1;
	for (var i = 2; i <= numPts+1; i++) {
		if (i <= numPts) {x2 = theGraph.plottedPointsX [i]; y2 = theGraph.plottedPointsY [i];}
// alert(x1 + "," + y1 + "," + x2 + "," + y2 + "," + theColor);
		if ((type == "-x-") || (type == "-")) {
			if (i <= numPts) segment(theGraph, x1,y1,x2,y2, theColor);
			}
		if (showLabels) {
			var theStr = '';
			if (labelType == "y") theStr = y1.toString();
			else theStr = "(" + x1.toString() + ", " + y1.toString() + ")";
			if (screenCoords(theGraph, x1, y1)[1] < 20) labelOffsetPosition = - labelOffsetPosition - 8;
// alert(x1 + "," + y1);
			putText(theGraph, theStr, x1,y1, 0, labelOffsetPosition)
			} // showLables
		x1 = x2; y1 = y2;
		} // i points


} // plotPoints




function interactiveLine(theGraph) {
// alert(theGraph);
var theCol = "red";
theGraph.clicked = ! theGraph.clicked;
//alert(theGraph.id + "   ,  " + theGraph.clicked);
if(theGraph.clicked) {
// alert(theGraph.pointsColor);
	setUpGraph(theGraph); 
	plotPoints(theGraph); // just puts up points with no coordinates
	theGraph.clicked = true;
	putX(theGraph, parseFloat(theGraph.xActual), parseFloat(theGraph.yActual), theCol);
	theGraph.xPrev = theGraph.xActual;
	theGraph.yPrev = theGraph.yActual;
	} // if clicked once
else {
	putX(theGraph, theGraph.xActual, theGraph.yActual, theCol);
	// segment(theGraph, theGraph.xPrev, theGraph.yPrev, theGraph.xActual, theGraph.yActual, theCol);
	// now calculate the line 
	var theSlope = (theGraph.yActual- theGraph.yPrev)/ (theGraph.xActual- theGraph.xPrev);
	var theIntercept = theGraph.yActual - theSlope*theGraph.xActual;
	var endX = theGraph.window[1];
	var endY = theIntercept + theSlope*endX;
	var beginX = theGraph.window[0];
	var beginY = theIntercept + theSlope*beginX;
	segment(theGraph, beginX, beginY, endX, endY, theCol);
	theGraph.slope = roundSigDig(theSlope ,2);
	theGraph.intercept = roundSigDig(theIntercept,2);
// alert("y = "+ theGraph.slope + "x + " + theGraph.intercept);
	}
}// interactiveLine
 

function interactiveCurve(theGraph,type,theShift) {
// alert(theGraph);

var theCol = "red"; 
if ((type == "exponential")|| (type == "exponentialShifted")) {
	theGraph.clicked = ! theGraph.clicked;
//alert(theGraph.id + "   ,  " + theGraph.clicked);
	if(theGraph.clicked) {
// alert(theGraph.pointsColor);
		setUpGraph(theGraph); 
		plotPoints(theGraph); // just puts up points with no coordinates
		putBars(theGraph, true, 'y');
		theGraph.clicked = true;
		putX(theGraph, parseFloat(theGraph.xActual), parseFloat(theGraph.yActual), theCol);
		theGraph.xPrev = theGraph.xActual;
		theGraph.yPrev = theGraph.yActual;
		} // if clicked once
	else {
		putX(theGraph, theGraph.xActual, theGraph.yActual, theCol);
		// segment(theGraph, theGraph.xPrev, theGraph.yPrev, theGraph.xActual, theGraph.yActual, theCol);
		// now calculate the curve 
		if (type == "exponentialShifted") {
			var newX1 = theGraph.xPrev - theShift;
			var newX2 = theGraph.xActual - theShift;
			var theSlope = Math.log((theGraph.yActual)/(theGraph.yPrev))/ (newX2 - newX1);
			var theIntercept = Math.log(theGraph.yActual) - theSlope*newX2;
			}
		else {
			var theSlope = Math.log((theGraph.yActual)/(theGraph.yPrev))/ (theGraph.xActual- theGraph.xPrev);
		var theIntercept = Math.log(theGraph.yActual) - theSlope*theGraph.xActual;
			}
	var theN = theGraph.plottedCurves.length; 
	var beginX = theGraph.window[0];
	var endX = theGraph.window[1];
	var AStr = roundSigDig(Math.exp(theIntercept),6);
	var bStr = roundSigDig(Math.exp(theSlope),6);
	var theNewGrStr = AStr + "*" + bStr +"^x";
	if (type == "exponentialShifted") {
		theNewGrStr = AStr + "*" + bStr +"^(x-"+ theShift.toString() + ")";
// alert(theNewGrStr);
		}
	theGraph.plottedCurves[theN] = [theNewGrStr, beginX,endX];
	theGraph.curvesColors [theN %9] = "red";
	plotAllCurves(theGraph);
	// putBars(gbeerQ, true, 'y');
	theGraph.plottedCurves.length = theN; // truncate the array back to original
	theGraph.slope = roundSigDig(Math.exp(theSlope),4);
	theGraph.intercept = roundSigDig(Math.exp(theIntercept),4);
// alert("y = "+ theGraph.slope + "x + " + theGraph.intercept);
	}
	} // if exponential
}// interactiveCurve


function setUpGraph(theGraph) {
theCanvas = document.getElementById(theGraph.canvaslabel);
ctx = theCanvas.getContext("2d");
makeGraph2(theGraph); // determines axis & gridline positions
drawDecorations(theGraph);
// plotPoints(theGraph);
theGraph.clicked = false;
} // saveGraph

function eraseGraph(theGraph) {
setUpGraph(theGraph);
} // restoreGraph

// ***  IT ALSO REMAINS TO DO THE TOPMATTER

// *** file loader
// * Javascript loaders **
// * These are due to
// http://www.phpied.com/javascript-include/
function include(script_filename) {
    document.write('<' + 'script');
    document.write(' language="javascript"');
    document.write(' type="text/javascript"');
    document.write(' src="' + script_filename + '">');
    document.write('</' + 'script' + '>');
}
// writedoc loader

function include_dom(script_filename) {
    var html_doc = document.getElementsByTagName('head').item(0);
    var js = document.createElement('script');
    js.setAttribute('language', 'javascript');
    js.setAttribute('type', 'text/javascript');
    js.setAttribute('src', script_filename);
    html_doc.appendChild(js);
    return false;
}

// * Now one that includes new JS only if already included

var included_files = new Array();

function include_once(script_filename) {
    if (!in_array(script_filename, included_files)) {
        included_files[included_files.length] = script_filename;
        include_dom(script_filename);
    }
}

function in_array(needle, haystack) {
    for (var i = 0; i < haystack.length; i++) {
        if (haystack[i] == needle) {
            return true;
        }
    }
    return false;

}

// * end of on-the-fly javascript includers


// ** end of file loaders

// Globals
// window.onerror = myErrorTrap;

var cmr10 = new Array();
// load font information
var path1 = pathPrefix + "graphObject/100/chars100.js";
var path2 = pathPrefix + "graphObject/graphWriter.js";
include_once(path1);
include_once(path2);

// alert("width of A = " +cmr10[0x41][0]);


var e = 2.718281828459045;
var pi = 3.141592653589793;



var theColor = 0; // the color of a pixel
var numColors = 7;
var lineColor = new Array();
	lineColor[0] = 	"red";
	lineColor[1] = 	"blue";
	lineColor[2] = 	"purple";
	lineColor[3] = 	"green";
	lineColor[4] = 	"magenta";
	lineColor[5] = 	"grey";
	lineColor[6] = 	"orange";
	lineColor[7] = 	"yellow";


	
	var theDigit = new Array();

for (var i = 0; i <= 9; i++) {
	theDigit [i] = new Image;
	theDigit [i].src = pathPrefix + "graphObject/digits/char3" + i.toString(16) + ".png";
	} // i
 
	theDigit[10] = new Image();
	theDigit[10].src = pathPrefix + "digits/point.gif";
	theDigit[11] = new Image();
	theDigit[11].src = pathPrefix + "digits/plus.gif";
	theDigit[12] = new Image();
	theDigit[12].src = pathPrefix + "digits/minus.gif";
	theDigit[13] = new Image();
	theDigit[13].src = pathPrefix + "digits/infinity.gif";
	theDigit[14] = new Image();
	theDigit[14].src = pathPrefix + "digits/e.gif";
var digitWidth = [6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 2, 7, 6, 12, 8];
var counter = 0; // for debugging
var theSqueezeFactor = .9; 
// The larger theSqueezeFactor is, the more spread out the tick mark labels
// if the tickmark labels crash into each other, increase it to at least 1
var X = 0;
var x = 0;
var y = 0;

var h = 0;
var xh = 0;
var hx = 0;
var t = 0;
var th = 0;
var ht = 0;

var A = 0;
var p1 = 0;

var quoteMark = unescape( '%22' );
var singlequoteMark = unescape( '%27' );


var infinity = 10000000000000  // 10^13;
var windowcropTally = 20; 
	// will not cut a window in half if more than this number of 
     // pixels pop out of range as a result



var autoY = true;
var autoGridline = true;

var okToRoll = true;

var theString = "";

var theFunction = ""; // the function


var xGridLines = new Array(); // these are screen coordinates
var yGridLines = new Array();
var xMinorGridLines = new Array(); // these are screen coordinates
var yMinorGridLines = new Array();
var xGridLinesActual = new Array(); // these are actual coordinates
var yGridLinesActual = new Array();

// var lineColor = 2; // red
// var lineColorLite = lineColor + 7;

var xAxisPosition = 50; // position of axes = -1 if not visible
var yAxisPosition = 100;
var xGridStep = 10;
var yGridStep = 10;
var sigDigNumx = 2;  // for rounding of tick marks
var sigDigNumy = 2;
var xVals = new Array(); // to store the values of x for evlauator
var yVals = new Array();  // to store the functions
var tminVals = new Array(); 
var tmaxVals = new Array();

var arraysize = 0; // number of functions
var xArraysize = 0; // number of x-values in evalautor
var maxnum = 5;  // max number of functions allowed
var maxnumX = 12; // max number of x-values allowed
var theValues = new makeArray2(maxnumX, maxnum); // copy of evalauator data

var fracMode = false; // fraction mode off default
var numSigDigs = 5;  // rounding of y-values default
var maxDenom = 99999;

// *** end globals


// *** Error Handler ******
function myErrorTrap(message,url,linenumber) {
alert("A lo mejor ha ingresadao algo equivocado o tal vez bede probar una version mas viejo. Pulse 'Muestra Ejemplos' para ver ejemplos de funciones correctamente formateadas.");
return (true);
} // end of on error

// ********************

// **********Utilities to read in the functions *********
// ********************************************************************
function setUp(){
	canvas = document.getElementById("cv");
	ctx = canvas.getContext("2d");
	okToRoll = true;
	with(Math){
		//Step 1: read the inputs into an array and decide
		// how many points there are
		var thexCellName = ""; // these are strings to names x1, x2,.. 

		var theInstruction = ""; // a javascript instuction
		var doIt = 0; // a dummy variable
				
		//Step 2: Fill the y arrays with the functions 
		for (var i = 1; i <= maxnum; i++) {
			theInstruction = "yVals["+i+"] = stripSpaces(document.theFormA.y"+i+".value);"
			doIt = eval(theInstruction);

			} // i
		// Step 3: Compute how many functions there are
		for (i = 1; i <= maxnum; i++) {
			if (yVals[i] == "") {
				arraysize = i-1;
				i = maxnum}
			} // i

	} //with math
// Step 4: Read in textarea points
readInTextarea();
if ((arraysize == 0)&&(!plottingPoints)) {alert("Debe ingresar al menos una funcion o un punto para trazar."); okToRoll = false}
} // setup


// ***********************************************************************
// ************** End of Reading-in Parametric Equations Utility ******
// ***********************************************************************



// **************** Plot All Curves ********************

function plotAllCurves(theGraph){
var theCurve;
for (var i = 0; i <= theGraph.plottedCurves.length-1; i++) {
	theCurve = theGraph.plottedCurves [i];
// alert (theCurve);
	var p = drawCurve(theGraph, theCurve, theGraph.curvesColors [i%9]);
	} // i
} // end of plot

// ******************End of Plot All Curves ***********

// **************** DRAWCURVE ******************************
// *** Draws a graph of a given funtion

function drawCurve(theGraph, theCurve, theCurveColor) {
okToRoll = true;
var thexMin = theCurve [1];
var thexMax = theCurve [2];
var theyString = theCurve [0];
var theLeftDecoration = theCurve[3];
var theRightDecoration = theCurve[4];
var theStrg = myParse(theyString);
var numDivisions = theGraph.pointsPerCurve; // for each curve
if (okToRoll) {
	
	// Search for a place to start the graph 
	// (in case initial y-coords are undefined or infinite.) 
	var deltax = (thexMax - thexMin)/numDivisions;
// alert(deltax);
// deltax = .25; // testing
	x1 = thexMin;
	x = x1;
	y1 = checkEval(theStrg);
// alert(y1);
// alert("x1 = " + x1 + "y1 = "+ y1 + (y1 > infinity));
	if ((isNaN(y1)) || (y1 == Infinity) || (y1 == -Infinity)) {
		for (var k = thexMin; k <= thexMax; k+=deltax) {
			x = k;
			x1 = k;
			y1 = checkEval(theStrg);
// if (k == thexMin) alert(theStrg + " " + y1);
			if(!isBad(y1)) break;
			} // end count
// alert(x1);
		if (k >= thexMax) {alert("Y no esta definida para su rango de X."); okToRoll = false}
		if (y1 > infinity) y1 = infinity;
		else if (y1 < -infinity) y1 = -infinity;
		} // y1 is not a number
			

	} // if OKtoRoll

if (okToRoll) {
		// now plot the points
	// at this point (x1, y1) is the acceptable sarting point
	// first put in left-end-points
	if (theLeftDecoration == "dot") putDot(theGraph, x1,y1, theCurveColor,false);
	else if (theLeftDecoration == "circle") putDot(theGraph, x1,y1, theCurveColor,true);

// alert(x);	

		var thecount = 0; /// testing
		var startingX = x + deltax;
		for (var k = startingX; k <= thexMax; k+=deltax) {
			thecount++;
// if (thecount == 35) alert("thcount = " + thecount + "k = "+k);
// if (thecount == 41) alert("thcount = " + thecount + "k = "+k);
			x2 = k;
			x = x2;
			y2 = checkEval(theStrg);
			if (!isNaN(y2)) {
				if (y2 > infinity) y2 = infinity;
				else if (y2 < -infinity) y2 = -infinity; 
// alert(x1 + "," + y1 + "," + x2 + "," + y2);
if (theGraph.adaptive) var p = adaptiveSegment(theGraph,x1,y1,x2,y2,theStrg, theCurveColor);
				else var p = segment(theGraph,x1,y1,x2,y2,theCurveColor);
				
				x1 = x2;
				y1 = y2;
				} // If second point is defined
			else {
				for (var p = x2+deltax; p <= thexMax; p+=deltax) {
					x = p;
					y1 = checkEval(theStrg);
					if(!isNaN(y1)) break;
					} // end count
				k = p; // reset k further along the loop
				x1 = p;  // y1 is already what it is supposed to be
				} // second point was undefined
				
			
if(thecount >= numDivisions + 2) k = thexMax+1;
			} // k
// put in right end-points
	if (theRightDecoration == "dot") putDot(theGraph, x1,y1, theCurveColor,false);
	else if (theRightDecoration == "circle") putDot(theGraph, x1,y1, theCurveColor,true);

// alert("k over");
	} // if okToRoll
} // function drawCurve


// ************** end of draw Curve *************

// ******************Draw Gridlines and Axes ***********
function drawDecorations(theGraph) {
var canvasWidth = theGraph.numX - theGraph.yLabelMargin; 
var canvasHeight = theGraph.numY - theGraph.xLabelMargin;
ctx.strokeStyle = lineStyler(theGraph.borderColor);
ctx.clearRect(0,0,canvasWidth+ theGraph.yLabelMargin, canvasHeight+ theGraph.xLabelMargin);
ctx.strokeRect (theGraph.yLabelMargin, 0, canvasWidth, canvasHeight);
ctx.strokeStyle = lineStyler(theGraph.gridColor);
// ***HERE
// First determine the vertical position of the x-tick marks
// and horiz position of y-tick marks
var xMarksPosition = canvasHeight-15;
if (!theGraph.xLabelsBelow) {
	if (xAxisPosition != -1) xMarksPosition = xAxisPosition + 6;
	if (xMarksPosition > canvasHeight - 5) xMarksPosition -= 23;
	}
else xMarksPosition = canvasHeight + 2;
// alert(xMarksPosition);
var yMarksPosition = 5;
var a = theGraph.window[0];
var b = theGraph.window[1];
var c = theGraph.window[2];
var d = theGraph.window[3];


// First the gridlines themselves
if ((theGraph.xGridStep > 0)&&(theGraph.xGrid == "on")) {
	for (var i = 1; i <= xGridLines[0]; i++) 
		{
// alert("i = " + i + " : " + xGridLines[i] + "of " + xGridLines[0]);
		var p = xGridLines[i];
		if (p > 0) {
			ctx.beginPath();
			ctx.moveTo(xGridLines[i], canvasHeight);
			ctx.lineTo(xGridLines[i], 0);
			ctx.stroke();
			ctx.closePath();
			} // if p is positive
		} // i
	} // if xGridStep
// alert("here");
if ((theGraph.yGridStep > 0) &&( theGraph.yGrid == "on")) {
	for (var i = 1; i <= yGridLines[0]; i++) 
		{
		var p = yGridLines[i];
		if (p > 0) {
			ctx.beginPath();
			ctx.moveTo(theGraph.yLabelMargin, yGridLines[i]);
			ctx.lineTo(canvasWidth + theGraph.yLabelMargin, yGridLines[i]);
			ctx.stroke();
			ctx.closePath();
			} // IF P IS POSITIVE
		} // i
	} // if yGridStep

// *** First the x-tick marks or x-axis labels ***
if (theGraph.xLabels.length > 0) {
	// first order the array xGridLines and eliminate repetitions etc
	// must add a and b as gridlines also in case they are not there
	// later repititions are eliminated anyway
// alert(xGridLines);
	xGridLines[0] += 2;
	xGridLines[xGridLines[0]-1] = theGraph.yLabelMargin;
	xGridLines[xGridLines[0]] = theGraph.yLabelMargin+ theGraph.canvasWidth;
	var xGTemp = xGridLines.slice(1, xGridLines[0]);
// alert(xGTemp);
	xGTemp.sort(function(a,b){return a - b}); // ascending
// alert(xGTemp);
	// eliminate repitions
	var xGTempN = [xGTemp[0]];
	var theIndex = 1;
	for (var i = 1; i <= xGTemp.length-1; i++) {
		if (xGTemp[i] > xGTemp[i-1]) {
			xGTempN[theIndex] = xGTemp[i];
			theIndex += 1;
			} // different
		} // i
// alert(xGTempN);
	xGridLines[0] = xGTempN.length;
	for (var i = 1; i <= xGridLines[0]; i++) {
		xGridLines[i] = xGTempN[i-1];
		} // i

jsPuttingXLabels = true;
	for (var i = 1; i <= xGridLines[0]; i++) {
		putText(theGraph, theGraph.xLabels[i-1], xGridLines[i], xMarksPosition, 0, -10, true)
		} // i
	jsPuttingXLabels = false;

// alert(xGridLines);
// place the labels at (xMarksPosition, centering automatic);


	} // putting labels


else if (theGraph.showScalex) {
	// set up array of ones to skip
	var skipArrayx = new Array();
	// first figure out how many significant digits to display
	sigDigNumx = 2;// minimum
	var mustIncrease = true;
	for (var i = sigDigNumx; i <= 12; i++) { 
		sigDigNumx = i;
	 if(!mustIncrease) break;
	 else {
		 for (var j = 1; j <= xGridLines[0]-1; j++) {
	 		if ((roundSigDig(xGridLinesActual[j],i) == roundSigDig(xGridLinesActual[j+1],i)) && (xGridLinesActual[j] != xGridLinesActual[j+1])) break;
		 		mustIncrease = false;
				} // j
			} // if mustIncrease
		} // i

	// need max length of the lables first -- roughly 6 pts/char
	var maxLength = 0;
	for (var i = theGraph.startTicksx; i <= xGridLines[0]; i++) {
		if ( ( i % theGraph.showEveryx == 0)&& (i >= theGraph.startTicksx) ) skipArrayx[i] = false; else skipArrayx[i] = true;
		var theStr = (roundSigDig(xGridLinesActual[i], sigDigNumx)).toString();
		var theLen = theStr.length*6;
		if(theLen > maxLength) maxLength = theLen;
		}// i
	// alert(theLen);
	var thexMultiple = 6666;
	if (xGridStep > 0) thexMultiple  = Math.round((b-a)* maxLength*theSqueezeFactor/(canvasWidth *xGridStep) + .5);
// alert(thexMultiple);
	if (thexMultiple < 6666) {
		// now actually put in the tick marks
			var theCharPosn = 0; 
			var deltaCharPos =0;
			var skipThis = false;
		for (var i = theGraph.startTicksx; i <= xGridLines[0]; i+= thexMultiple) {
			skipThis = false;
			if ((i > theGraph.Misc[0] ) && (i - thexMultiple < theGraph.Misc[0])) i = theGraph.Misc[0];
// if (theGraph.id == "g2") alert("i = " + i + " the actual coord of the gridline is " + xGridLinesActual[i] + " and the screen coord is " + xGridLines[i]);
			if (!theGraph.xLabelsBelow) {if ((xGridLines[i] <= theGraph.yLabelMargin) || (xGridLines[i] >= canvasWidth + theGraph.yLabelMargin)) skipThis = true;}
			else {
				if ((xGridLines[i] < theGraph.yLabelMargin) || (xGridLines[i] > canvasWidth + theGraph.yLabelMargin)) skipThis = true;
				}
	

			if ((!skipThis) && (!skipArrayx[i])) {
// alert("i = " + i + " the actual coord of the gridline is " + xGridLinesActual[i] + " and the screen coord is " + xGridLines[i]);
				var theStr = (roundSigDig(xGridLinesActual[i], sigDigNumx)).toString();
				var theLen2 = theStr.length;
				var theDig = '';
				var theCmd = '';
				theCharPosn = Math.round(-theLen2*3); // centering
				var hitEdge = false;
				if(xGridLines[i] + theCharPosn < -theGraph.edgeBuffer) {
					// check if it can be shifted to fit in
					if (9*theLen2 >= maxLength) hitEdge = true;
					else theCharPosn = theGraph.edgeBuffer;
// alert(9*theLen2 + "' maxLength = " + maxLength);
					} 
				else if (xGridLines[i] + theCharPosn + theLen2*6 > canvasWidth +  theGraph.yLabelMargin + theGraph.edgeBuffer) {
					if (9*theLen2 >= maxLength) hitEdge = true;
					else theCharPosn = Math.round(-theLen2*7);
					} 
				if (!hitEdge) {
					deltaCharPos =0;
					for (var j = 0; j < theLen2; j++) {
						theCmd = 'ctx.drawImage(theDigit[';
						theDig = theStr.charAt(j);
						if (isNumberChar(theDig)) {theCmd += theDig; deltaCharPos = digitWidth[parseInt(theDig)]}
						else if (theDig == ".") {theCmd += "10"; deltaCharPos = 2}
						else if (theDig == "e") {theCmd += "14"; deltaCharPos = 7}
						else if (theDig == "-") {theCmd += "12"; deltaCharPos = 6}
						else if (theDig == "+") {theCmd += "11"; deltaCharPos = 9}
						else {theCmd += "13"; deltaCharPos = 8}; // should not happen
			
						theCmd += "]," + (xGridLines[i] + theCharPosn) + "," + xMarksPosition + ")";

						eval(theCmd);
						theCharPosn += deltaCharPos;
						} // j
					} // if not hitEdge
				} // if not skipThis
			} // i
		} // if thexMultiple < 6666
	} // if showScalex
// *** End of the x-tick marks ***
// alert("here");
// *** Now the y-tick marks ***
if (theGraph.showScaley){
// alert("here")
	var skipArrayy = new Array();
	// first figure out how many significant digits to display
	sigDigNumy = 2;// minimum
	var mustIncrease = true;
	for (var i = sigDigNumy; i <= 12; i++) { 
		sigDigNumy = i;
		if(!mustIncrease) break;
		else {
			for (var j = 1; j <= yGridLines[0]-1; j++) {
				if ((roundSigDig(yGridLinesActual[j],i) == roundSigDig(yGridLinesActual[j+1],i)) && (yGridLinesActual[j] != yGridLinesActual[j+1])) break;
				mustIncrease = false;
				} // j
			} // if mustIncrease
		} // i
	for (var i = 1; i <= yGridLines[0]; i++) {
		if ( ( i % theGraph.showEveryy == 0)&& (i >= theGraph.startTicksy) ) skipArrayy[i] = false; else skipArrayy[i] = true;
		} // i
	var theHeight = 10; // rough height of a digit
	var theyMultiple = 6666;
	if (yGridStep > 0) theyMultiple  = Math.round((d-c)*theHeight*1.5/(canvasWidth *yGridStep*(theGraph.showEveryy)) + .5);
// alert(theGraph.showEveryy  + "'" + theyMultiple);

	if (theyMultiple < 6666) {
		// now actually put in the tick marks
		// first estimate longest label
		var maxLen = 0;
		for (var i = theyMultiple; i <= yGridLines[0]; i++) {
			var theStr = (roundSigDig(yGridLinesActual[i], sigDigNumy)).toString();
			var theLen = theStr.length;
			if (theLen > maxLen) maxLen = theLen;
			} // i
			var theCharPosn = 0; 
			var deltaCharPos =0;
			var skipThis = false;
		for (var i = 1; i <= yGridLines[0]; i+= theyMultiple) {
			skipThis = false;
// alert("i = " + i + " the actual coord of the gridline is " + yGridLinesActual[i] + " and the screen coord is " + yGridLines[i]);
			if ((yGridLines[i] <= 0) || (yGridLines[i] >= canvasHeight)) skipThis = true;
// Following is a fix for the fact that the y gridlines are not ordered if the x-axis is there
if ((i > 1) && (c*d < 0) && (yGridLinesActual[i]* yGridLinesActual[i-1] < 0)){
		i+= theyMultiple-1;
		}
		if ((!skipThis) && (!skipArrayy[(1+i- theyMultiple)/theyMultiple]))  {


			var theStr = (roundSigDig(yGridLinesActual[i], sigDigNumy)).toString();
			var theLen = theStr.length;
			var theDig = '';
			var theCmd = '';
			theCharPosn = 5; // no clue where this came from but watch out for it
			if (yAxisPosition != -1) {
				if (yAxisPosition < theGraph.yLabelMargin + canvasWidth/2) yMarksPosition = yAxisPosition +2 - theCharPosn;
				else yMarksPosition = yAxisPosition - 4- theLen*6.5 - theCharPosn;
				}
			// compute the length of the string on the canvas
			var wordLen = 0;
			for (var j = 0; j < theLen; j++) {
				theDig = theStr.charAt(j);
				if (isNumberChar(theDig))wordLen += digitWidth[parseInt(theDig)];
				else if (theDig == ".") { wordLen += 2}
				else if (theDig == "e") { wordLen += 8}
				else if (theDig == "-") { wordLen += 6}
				else if (theDig == "+") { wordLen += 9}
				} // j
			if (theGraph.yLabelsLeft) yMarksPosition = theGraph.yLabelMargin- wordLen - 3 - theCharPosn;
			deltaCharPos =0;
			for (var j = 0; j < theLen; j++) {
				theCmd = 'ctx.drawImage(theDigit[';
				theDig = theStr.charAt(j);
				if (isNumberChar(theDig)) {theCmd += theDig; deltaCharPos = digitWidth[parseInt(theDig)]}
				else if (theDig == ".") {theCmd += "10"; deltaCharPos = 2}
				else if (theDig == "e") {theCmd += "14"; deltaCharPos = 8}
				else if (theDig == "-") {theCmd += "12"; deltaCharPos = 6}
				else if (theDig == "+") {theCmd += "11"; deltaCharPos = 9}
				else {theCmd += "13"; deltaCharPos = 8}; // should not happen
			
				theCmd += "]," + (yMarksPosition + theCharPosn) + "," + (yGridLines[i] -5) + ")";

				eval(theCmd);
				theCharPosn += deltaCharPos;
				} // j
			} // if not skipThis
		} // i
	} // if theyMultiple < 6666

// *** End of the y-tick marks ***
} // if showScaley


// Next the axes
// alert(yAxisPosition);
if ((yAxisPosition != -1)&&(theGraph.yAxis == "on")) {
	ctx.strokeStyle = "rgb(0,0,0)";
	ctx.beginPath();
	ctx.moveTo(yAxisPosition, canvasHeight);
	ctx.lineTo(yAxisPosition, 0);
	ctx.lineTo(yAxisPosition+3, 8);
	ctx.moveTo(yAxisPosition, 0);
	ctx.lineTo(yAxisPosition-3, 8);
	ctx.stroke();
	ctx.closePath();
	} // y axis

if ((xAxisPosition != -1) &&(theGraph.xAxis == "on")) {
	ctx.strokeStyle = "rgb(0,0,0)";
	ctx.beginPath();
	ctx.moveTo(theGraph.yLabelMargin, xAxisPosition);
	ctx.lineTo(canvasWidth+ theGraph.yLabelMargin, xAxisPosition);
	ctx.lineTo(canvasWidth+ theGraph.yLabelMargin -8, xAxisPosition+3);
	ctx.moveTo(canvasWidth+ theGraph.yLabelMargin, xAxisPosition);
	ctx.lineTo(canvasWidth+ theGraph.yLabelMargin -8, xAxisPosition-3);
	ctx.stroke();
	ctx.closePath();
	} // x axis



} // drawDecorations


// ******************Enf of Draw Gridlines and Axes ***********

// *************** Utilities follow ***************************

function screenCoords(theGraph, x1, y1) {
// returns the screen coordinates as an array [0] = x [1] = y
var a = theGraph.window[0];
var b = theGraph.window[1];
var c = theGraph.window[2];
var d = theGraph.window[3]; 
var theWidth = theGraph.numX - theGraph.yLabelMargin; 
var theHeight = theGraph.numY - theGraph.xLabelMargin;
var x1bar = theGraph.yLabelMargin + Math.round(theWidth*(x1-a)/(b-a) );
var y1bar = Math.round(theHeight*(d-y1)/(d-c) );
return([x1bar, y1bar]);
}

function sesame(url,hsize,vsize){ 
// Default size is 550 x 400
        var tb="toolbar=0,directories=0,status=0,menubar=0"
        tb+=",scrollbars=1,resizable=1,"
    var tbend="width="+hsize+",height="+vsize;
    if(tbend.indexOf("<undefined>")!=-1){tbend="width=550,height=400"}
        tb+=tbend
        Win_2 = window.open("","win2",tb);
        Win_2 = window.open(url,"win2",tb);
	Win_2.focus();
    }


function stripSpaces (InString)  {
	OutString=""; 
	if (InString == "") return (OutString);
	for (Count=0; Count < InString.length; Count++)  {
		TempChar=InString.substring (Count, Count+1);
		if (TempChar!=" ")
			OutString=OutString+TempChar;
	}
	return (OutString);
}

function stripChar (InString,symbol)  {
	OutString="";
	for (Count=0; Count < InString.length; Count++)  {
		TempChar=InString.substring (Count, Count+1);
		if (TempChar!=symbol)
			OutString=OutString+TempChar;
	}
	return (OutString);
}

function replaceChar (InString,oldSymbol,newSymbol)  {
	OutString="";
	for (Count=0; Count < InString.length; Count++)  {
		TempChar=InString.substring (Count, Count+1);
		if (TempChar!=oldSymbol)
			OutString=OutString+TempChar
		else OutString=OutString+newSymbol;
	}
	return (OutString);
}


function makeArray2 (X,Y)
	{
	var count;
	this.length = X+1;
	for (var count = 1; count <= X+1; count++)
		// to allow starting at 1
		this[count] = new makeArray(Y);
	} // makeArray2

function makeArray (Y)
	{
	var count;
	this.length = Y+1;
	for (var count = 1; count <= Y+1; count++)
		this[count] = 0;
	} // makeArray


function rightString (InString, num)  {
	OutString=InString.substring (InString.length-num, InString.length);
	return (OutString);
}

function rightTrim (InString)  {
	var length = InString.length;
	OutString=InString.substring(0,length-1);
	return (OutString);
}



function checkString(InString,subString,backtrack)
// check for subString
// if backtrack = false, returns -1 if not found, and left-most location in string if found
// if backtrack = true, returns -1 if not found, and right-most location in string if found
// note that location is to the left of the substring in both cases
{
var found = -1;
var theString = InString;
var Length = theString.length;
var symbLength = subString.length;
for (var i = Length- symbLength; i >-1; i--)
	{	
	TempChar=theString.substring (i, i+ symbLength);
	if (TempChar == subString) 
			{
			found = i;
			if (backtrack) i = -1
			}
	} // i
return(found);
} // check

function replaceSubstring (InString,oldSubstring,newSubstring)  {
	OutString="";
	var sublength = oldSubstring.length;
	for (Count=0; Count < InString.length; Count++)  {
		TempStr=InString.substring (Count, Count+sublength);
		TempChar=InString.substring (Count, Count+1);
		if (TempStr!= oldSubstring)
			OutString=OutString+TempChar
		else 
			{
			OutString=OutString+ newSubstring;
			Count +=sublength-1
			}

	}
	return (OutString);
} 

function parser (InString, Sep)  {
	NumSeps=1;
	for (Count=1; Count < InString.length; Count++)  {
		if (InString.charAt(Count)==Sep)
			NumSeps++;
	}
	parse = new makeArray (NumSeps+4, "");		// my adjustments
	Start=0; Count=1; ParseMark=0;
	LoopCtrl=1;
	while (LoopCtrl==1)  {
		ParseMark = InString.indexOf(Sep, ParseMark);
		TestMark=ParseMark+0;
		if ((TestMark==0) || (TestMark==-1)){
			parse[Count]= InString.substring (Start, InString.length);
			LoopCtrl=0;
			break;
		}
		parse[Count] = InString.substring (Start, ParseMark);
		Start=ParseMark+1;
		ParseMark=Start;
		Count++;
	}
	parse[0]=Count;
	return (parse);
}

function winopen(){
// opens a window in the bottom frame
	var str = winopen.arguments[0];
	var loc = winopen.arguments[1];
	if (navigator.appName == "Microsoft Internet Explorer") this.parent.bottom.window.location = str;
	else window.open(str,loc);
} // winopen

function looksLikeANumber(theString) {
// returns true if theString looks like it can be evaluated
var result = true;
var length = theString.length;
var x = ""
var y = "1234567890-+/*. "
var yLength = y.length;
for (var i = 0; i <= length; i++)
	{ 
	x = theString.charAt(i);
		result = false;
		for (var j = 0; j <= yLength; j++) 
			{
			if (x == y.charAt(j)) {result = true; break}
			} // j
	if (result == false) return(false);
	} // i
return(result);
} // looks like a number

function shiftRight(theNumber, k) {
	if (k == 0) return (theNumber)
	else
		{
		var k2 = 1;
		var num = k;
		if (num < 0) num = -num;
		for (var i = 1; i <= num; i++)
			{
			k2 = k2*10
			}
		}
	if (k>0) 
		{return(k2*theNumber)}
	else 
		{return(theNumber/k2)}
	}


function roundSigDig(theNumber, numDigits) {
	with (Math)
		{
// alert(theNumber);
		if (isBad(theNumber)) return theNumber;
		else if (theNumber == 0) return(0);
		else if(abs(theNumber) < 0.000000000001) return(0);
// WARNING: ignores numbers less than 10^(-12)
		else
			{
			var k = floor(log(abs(theNumber))/log(10))-numDigits+1
			var k2 = shiftRight(round(shiftRight(abs(theNumber),-k)),k)
			if (theNumber > 0) return(k2);
			else return(-k2)
			} // end else
		}
} // roundSigDig



function roundSigDigUpDown(theNumber, numDigits, up) {
	with (Math)
		{
// alert(theNumber);
		if (isBad(theNumber)) return theNumber;
		else if (theNumber == 0) return(0);
		else if(abs(theNumber) < 0.000000000001) return(0);
// WARNING: ignores numbers less than 10^(-12)
		else
			{
			var k = floor(log(abs(theNumber))/log(10))-numDigits+1
			var k2 = 0;
			if (up) k2 = shiftRight(1+floor(shiftRight(abs(theNumber),-k)),k);
			else k2 = shiftRight(floor(shiftRight(abs(theNumber),-k)),k);
			if (theNumber > 0) return(k2);
			else return(-k2)
			} // end else
		}
} // roundSigDigUpDown

function roundDec(theNumber, numPlaces) {
with (Math)
	{
	var x =shiftRight(round(shiftRight(theNumber,numPlaces)),-numPlaces);
	return x;
	} // with math
} // roundDec


// ********* FUNCTION PARSER ***********
function myEval(theString)
{
return(eval(myParse(theString)))
}

function checkEval(theString) {
		try
		{
 		return(eval(theString));
		}
	catch (error)
		{
 		 return("not a number");
		}
}


// The above function requires all the following routines
function breakApart(InString) {
	// ******* Input: any string such as aaa*bbb or (aa*aa)*bbb
	// *** This Routine Retuns two pieces
	// *** bbb starts at the left-most operation *, /,  - or +
	// *** if it sees a paren, it stops after closure.

	theString = InString;
	var Length = theString.length;
	var outArray = new Array();
	outArray[1] = theString;
	outArray[2] = "";
	var parenCount = 0;
	var parenWatch = false;
	var looking = true;
	
	
	if (theString.substring (0,1) == "(")
		{
		parenCount++;
		parenWatch = true;
		looking = false;
		}
	// Look for operators
	
	for (Count=1; Count < Length; Count++)  
		{
		TempChar=theString.substring (Count, Count+1);
		if (TempChar == "(") 
			{parenCount ++;}
		else if (TempChar == ")") {parenCount = parenCount-1};

		if ((parenCount == 0) && (parenWatch == true))
			 {
			parenWatch = false;
			outArray[1] = theString.substring (0, Count+1);
			outArray[2] = theString.substring (Count+1, Length);
			}

		if (looking == true)
			{
		if ( ( (TempChar == "*") || (TempChar == "/") || (TempChar == "-")  ) || ( (TempChar == "+") || (TempChar == ')' )  )  )
				{ 
				
					{
					// alert(Count);
					looking = false;
					outArray[1] = theString.substring (0, Count);
					outArray[2] = theString.substring (Count, Length);
					// alert (outArray[1]);
					// alert(outArray[2]);
					} // end if hit one
				} 

			} // end if looking

		} // end of loop


	return (outArray);

} // end of breakApart

function isNumberChar (InString)  {
	if(InString.length!=1) 
		return (false);
	RefString="1234567890)";
	if (RefString.indexOf (InString, 0)==-1) 
		return (false);
	return (true);
}

function isCharHere (InString, RefString)  {
	if(InString.length!=1) 
		return (false);
	if (RefString.indexOf (InString, 0)==-1) 
		return (false);
	return (true);
}

function putProduct(InString) {
OutString="";
for (Count=0; Count < InString.length; Count++)  {
		TempChar=InString.substring (Count, Count+1);
		if (!isCharHere(TempChar,"xXeslcapdDuUhHtT(") || (Count == 0) )
			{OutString=OutString+TempChar}
		else 
			{
			if (isNumberChar(InString.substring(Count-1,Count)))
				{OutString=OutString+"*"+TempChar}
			else OutString=OutString+TempChar
			}
	}

	return (OutString);
}

function reverse (InString)  {
	OutString="";
	var Length = InString.length;
	for (Count=Length; Count > -1; Count--)  {
		TempChar=InString.substring (Count, Count+1);
		if (TempChar == "(") {TempChar = ")"}
		else if  (TempChar == ")") {TempChar = "("}
		OutString=OutString+TempChar;
		}
	return (OutString);
	}

function powFix2(InString) {
	// ****Replaces one "^" by "pow"

	theString = InString;
	var Length = theString.length;
	outString = theString; 
		// in case nothing happens
	
		// Look for wedge
	var looking = true;
	for (Count=0; Count < Length; Count++)  
		{
		if (looking)
			{
			TempChar=theString.substring (Count, Count+1);
			if (TempChar == "^")
				{
				looking = false;
				rightStr = theString.substring (Count+1,Length);
				leftStr = theString.substring (0,Count);
				// deal with right-hand string
				Aray = breakApart(rightStr);
				Arg2 = Aray[1];
				rightRest = Aray[2];
			
				backString = reverse(leftStr);
				Aray = breakApart(backString);
				Arg1 = reverse(Aray[1]);
				leftRest = reverse(Aray[2]);
				outString = leftRest+"Math.pow("+Arg1+","+Arg2+")"+rightRest;
				
				} // end hif hit a wedge

			} // end of looking for a wedge
		} // end of loop

// ****** testing *******
// document.Extra.diagnostics.value += outString + cr;
// ***** end testing *****

return (outString);

} // end of powFix2

function powCheck(InString) {
	// ****checks for ^
	
	theString = InString;
	var Length = theString.length;
	
	// Look for wedge
	var found = false;
	for (Count=0; Count < Length; Count++)  
		{
		TempChar=theString.substring (Count, Count+1);
		if (TempChar == "^")
			{
			found = true;
			} // end if hit a wedge
		} // end of looking for a wedge
	return(found);


} // end of powCheck

function isBad(theNum) {
if ((isNaN(theNum)) || (theNum == Infinity) || (theNum == -Infinity) || (theNum > infinity) || (theNum < -infinity)) return(true);
else return(false)
}

function myParse(expression)
{
// alert('here')
		var theString = stripSpaces(expression);		
		with (Math)
			{
		// now convert formatting from GC formatting		
		theString = putProduct(theString);
		theString = replaceSubstring(theString,"log","(1/Math.log(10))*Math.log");
		theString = replaceSubstring(theString,"ln","Math.log");
		theString = replaceSubstring(theString,"abs","Math.abs");
			while (powCheck(theString))
				{
				theString = powFix2(theString);
				// alert(theString);
				}
		theString = theString.toLowerCase();
		theString = replaceSubstring (theString,"math.","Math."); 
		// in case the user put in a math. something
// alert(theString);
			} // with Math
		theString = replaceSubstring (theString,"exp","Math.exp");
		theString = replaceSubstring (theString,"cos","Math.cos");
		theString = replaceSubstring (theString,"sin","Math.sin");
		theString = replaceSubstring (theString,")(",")*(");
		theString = replaceSubstring (theString,")ln",")*ln");
		theString = replaceSubstring (theString,"sqrt","Math.sqrt");
		theString = replaceSubstring (theString,"x(","x*(");
		theString = replaceSubstring (theString,")x",")*x");
		return(theString);
} // myParse
// ******** END FUNCTION PARSER **************

function toFrac(x, maxDenom) {
	if (isBad(x)) return x;
	var theFrac = new Array();
	theFrac[1] = 0;
	theFrac[2] = 0;
	var p1 = 1;
	var p2 = 0;
	var q1 = 0;	
	var q2 = 1;	
	var u =0;
	var t = 0;
	var flag = true;
	var negflag = false;
	var a = 0;
	var xIn = x; // variable for later
	var n = 0;
	var d = 0;
	var p = 0;
	var q = 0;

	if (x >10000000000) return(theFrac);
while (flag)
	{
	if (x<0) {x = -x; negflag = true; p1 = -p1}
	var intPart = Math.floor(x);
	var decimalPart = roundSigDig((x - intPart),15);

	x = decimalPart;
	a = intPart;
	
	t = a*p1 + p2;
	u = a*q1 + q2;
	if  ( (Math.abs(t) > 10000000000 ) || (u > maxDenom ) ) 
		{
			n = p1;
			d = q1;
			break;
		}

		p = t;
		q = u;
			
//		cout << "cf coeff: " << a << endl; // for debugging
//		cout << p << "/" << q << endl;	// for debugging
		
	if ( x == 0 )
		{
		n = p;
		d = q;
		break;
		}

		p2 = p1;
		p1 = p;
		q2 = q1;
		q1 = q;
		x = 1/x;
	
	} // while ( true );
	
	theFrac[1] = n;
	theFrac[2] = d;

	if (theFrac[2] == 1) return (theFrac[1].toString());
	else return (theFrac[1] + "/" + theFrac[2]);

} // toFrac




// ***********************************************
// **** Graphing Routine
// ***********************************************
var basicsRead = false;
function readBasics() {
// alert("here");
var theStrg = "";  // dummy string for evaluating functions
autoY = document.theFormB.autoYButton.checked;
autoGridline = document.theFormB.autoGridButton.checked;
// get the graph window information
	for (var k = 1; k <= 1; k++)
	{
	var aa = document.theFormB.a.value; 
// alert(aa);
	if (aa == "") { alert("No ha ingresado un numero para xMin."); okToRoll = false; break;}
//alert(aa);
	a = myEval(aa);
	if (isNaN(a) ) { alert("No ha ingresado un numero para xMin."); okToRoll = false; break;}
	var bb = document.theFormB.b.value; 
	if (bb == "") { alert("No ha ingresado un numero para xMax."); okToRoll = false; break}
	b = myEval(bb); 
	if (isNaN(b) ) { alert("No ha ingresado un numero para xMax."); okToRoll = false; break;}
	if ( (okToRoll) && (a >= b)) { alert("xMax debe ser mas grande que xMin"); okToRoll = false; break;}
	if(!autoY) {
// alert("Here autoY is off");
		var cc = document.theFormB.c.value; 
		if (cc == "") { alert("No ha ingresado un numero para yMin. (Si no, marque 'Auto'.)"); okToRoll = false; break}
		c = myEval(cc); 
		if (isNaN(c) ) { alert("No ha ingresado un numero para yMin. (Si no, marque 'Auto'.)"); okToRoll = false; break;}
		var dd = document.theFormB.d.value; 
		if (dd == "") { alert("No ha ingresado un numero para yMax. (Si no, marque 'Auto'.)"); okToRoll = false; break}
		d = myEval(dd); 
		if (isNaN(d) ) { alert("No ha ingresado un numero para yMax. (Si no, marque 'Auto'.)"); okToRoll = false; break;}
		if ( (okToRoll) && (c >= d)) { alert("yMax debe ser mas grande que yMin"); okToRoll = false; break;}
// alert(a + " , " + b + " , " + c + " , " + d);
		} // end of if autoY
	else {
		document.theFormB.c.value = ''; // cannnot have it both ways
		document.theFormB.d.value = ''; 
		// Must compute ymin and ymax here
		var deltax = (b-a)/canvasWidth;
// alert(deltax);
		var maxy = 0;
		var miny = 0;
		var firstCheck = true;
		for (var j = 1; j <= arraysize; j++) {
			theStrg = myParse(yVals[j]);
			for (var i = 0; i <= canvasWidth; i++)
				{
				x = a + i*deltax;
// alert("x = " + x);
				y  = checkEval(theStrg);
				if (!isNaN(y) &&( y < infinity) && (y > -infinity))
					{
					// alert ("y = " + y);
					if (firstCheck) 
						{
						firstCheck = false; 
						maxy = y; 
						miny = y
						}
					if (y > maxy) maxy = y;
					else if (y < miny) miny = y;
					} // end of if y is a legit number
				} // i
// alert(miny);
			} // j
	
// alert("miny = "+miny + "maxy =" + maxy);
			// Now cut down the size of the window if necessary
			// in the case of graphs shooting off to infinity
			// the teqnique is to eliminate "outliers" by cropping 
			// the window.


// *** Why don't we just compute the st deviation and crop to +- 3s
			var cutting_down = true;
			var invisible_tally = 0;
			var maxSteps = 10, steppes = 0;
			while ((cutting_down) && (steppes < maxSteps))
				{
				steppes ++;
				maxy = maxy/2;
				miny = miny/2;
				invisible_tally = 0;
				for (var j = 1; j <= arraysize; j++) {
					theStrg = myParse(yVals[j]);

					for (var i = 0; i <= numX; i++)
						{
						x = a + i*deltax;
						y  = checkEval(theStrg);
						if (!isNaN(y) &&( y < infinity) && (y > -infinity))
							{
							if ((y > maxy) || (y < miny))
								{
								invisible_tally++;
								if (invisible_tally > windowcropTally)
									{
									cutting_down = false;
									maxy = 2*maxy;
									miny = 2*miny;
									i = numX;
									break;
									} // too many invisible;
								} // if y > ymax
						} // if is a number
					} // i
				} // j
			// by the end of this cutting_down had better be false;
			} // while cutting_down
// alert("miny = "+miny + "maxy =" + maxy);

		
		if (miny == maxy) {miny  = miny-1; maxy += 1}

		// ** following two lines added for plotting points
		if (plottingPoints) {
			if (yMaxPoints > maxy) maxy = yMaxPoints;
			if (yMinPoints < miny) miny = yMinPoints;
			}
		var scalefactor = 150/(maxy - miny); 
// ************
// end of y min and ymax window coords
// ************

		c = eval(roundSigDigUpDown (miny,4, false)); // sets the globals
		d = eval(roundSigDigUpDown (maxy,4, true));
		} // end of else for autoY
// alert("c = " + c + " d = " + d);
// At this point we have the globals a, b, c, d we need
	if(!autoGridline) {
		var xk = document.theFormB.xg.value;
		if (xk == "") xGridStep = 0;
		else xGridStep = eval(xk);
		var yk = document.theFormB.yg.value;
		if (yk == "") yGridStep = 0;
		else yGridStep = eval(yk);
		} // end of if not autoGridline
	else {
		document.theFormB.xg.value = ''; 
		document.theFormB.yg.value = ''; // cannnot have it both ways.
		var pq = (b-a)/10;
		xGridStep = pq;
		pq = pq = (d-c)/10;
		yGridStep = pq;
		} // end of else for autoGridline
	} // end of single loop (k)
if (okToRoll) basicsRead = true;
} // readBasics

// ********************************************************************
// *********** Initilaize the Canvas & Set up the Axes and Gridlines ****
// ********************************************************************

function makeGraph2(theGraph)
{
// alert(roundSigDig(.000001, 1));
if (okToRoll) {
var a = theGraph.window[0];
var b = theGraph.window[1];
var c = theGraph.window[2];
var d = theGraph.window[3];
var canvasWidth = theGraph.numX;
var canvasHeight = theGraph.numY;
if(theGraph.yLabelsLeft) {theGraph.yLabelMargin = 40}
canvasWidth-= theGraph.yLabelMargin;
if(theGraph.xLabelsBelow) {theGraph.xLabelMargin = 12} 
canvasHeight -= theGraph.xLabelMargin;

// initialize the canvas
// now set up the axes & gridlines
	xGridStep = theGraph.xGridStep;
	yGridStep = theGraph.yGridStep;
	
	// gridlines first
	// setup position of gridlines
	theGraph.Misc[0] = 6660000000;
	if (xGridStep > 0) xGridLines[0] = 1+Math.round((b-a)/xGridStep );
	else xGridLines[0] = 0; // number of gridlines
	if (yGridStep > 0) yGridLines[0] = 1+Math.round(  (d-c)/yGridStep );
	else yGridLines[0] = 0;
	// initialize these arrays to zero 
	for (var i = 1; i <= xGridLines[0]; i++) { xGridLines[i] = 0; xGridLinesActual[i] = a}
	for (var i = 1; i <= yGridLines[0]; i++) { yGridLines[i] = 0; yGridLinesActual[i] = d}
	var pq = 0; // just a dummy variable
// alert(theGraph.yLabelMargin);
	if (a*b >= 0) {
		// no y-axis appears in the interior in this case

		for (var i = 1; i <= xGridLines[0]; i++)
			{
			xGridLines[i] = Math.round(theGraph.yLabelMargin + i*xGridStep*canvasWidth/(b-a)  );
			xGridLinesActual[i] = a + i*xGridStep;
// alert("i = " + i + " : " + xGridLines[i] + cr);
			} // x Grid Line Positions
		} // if a and b have the same sign
	else 
		{ // want the y-axis to be one of the gridlines

		for (var i = 1; i <= xGridLines[0]; i++)
			{	
			pq = Math.round(theGraph.yLabelMargin + (i*xGridStep - a)*canvasWidth/(b-a));

			if ((pq <= canvasWidth + theGraph.yLabelMargin) && (pq >= 0)) {
				xGridLines[i] = pq;
				xGridLinesActual[i] = i*xGridStep;
				}
			else break;
			} // loop i
		i -= 1; //overstepped i
		theGraph.Misc[0] = xGridLines[0] - i; // for labels below
		// this just records the index of the first negative gridline
		for (var j = 1; j <= xGridLines[0] - i; j++)
			{
			pq = Math.round(theGraph.yLabelMargin  + (-j*xGridStep - a)*canvasWidth/(b-a));
// alert("j = " + j + "pq = " + pq);
			if ((pq <= canvasWidth + theGraph.yLabelMargin) && (pq >= theGraph.yLabelMargin)) 
				{
				xGridLines[j+i] = pq;
				xGridLinesActual[j+i] = -j*xGridStep;
				}
			else {
				xGridLines[0] = j-1+i; // cut off excess repeats
				}
			} // loop j
			// add an extra gridline in 1st posn if labels are below
			if (theGraph.xLabelsBelow) { 
				// include y-axis as a gridline
				xGridLines[0] += 1; 
				for (var k = xGridLines[0]+1; k >=2; k-- ) {
					xGridLines[k] = xGridLines[k-1];
					xGridLinesActual[k] = xGridLinesActual[k-1];
					} // k
				xGridLines[1] = screenCoords(theGraph,0,0)[0];
				xGridLinesActual[1] = 0;
				} // labels below
		} // a and b have opposite sign
		

	if (c*d >= 0) {
		for (var i = 1; i <= yGridLines[0]; i++)
			{
			yGridLines[i] = Math.round( i*yGridStep*canvasHeight/(d-c)  );
			yGridLinesActual[i] = d - i*yGridStep;
			} // y Grid Line Positions
		} // if c and d have the same sign
	else {
		for (var i = 1; i <= yGridLines[0]; i++)
			{
			pq = Math.round((i*yGridStep - c)*canvasHeight/(d-c));
			if ((pq <= canvasHeight) && (pq >= 0)) {
				yGridLines[i] = canvasHeight - pq;
				yGridLinesActual[i] = i*yGridStep;
				}
			else break;
			} // loop i
		for (var j = 1; j <= yGridLines[0] - i; j++)
			{
			pq = Math.round((-j*yGridStep - c)*canvasHeight/(d-c));
// alert("j = " + j + "pq = " + pq);
			if ((pq <= canvasHeight) && (pq >= 0)) {
				yGridLines[j+i] = canvasHeight - pq;
				yGridLinesActual[j+i] = -j*yGridStep;
				}
			else {
				yGridLines[j+i] = 0;
				yGridLinesActual[j+i] = d;
				}
			} // loop j
			if (theGraph.yLabelsLeft) { 
				// include x-axis as a gridline
				yGridLines[0] += 1; 
				for (var k = yGridLines[0]+1; k >=2; k-- ) {
					yGridLines[k] = yGridLines[k-1];
					yGridLinesActual[k] = yGridLinesActual[k-1];
					} // k
				yGridLines[1] = screenCoords(theGraph,0,0)[1];
				yGridLinesActual[1] = 0;
				} // labels below
		} // if c and d have opposite sign
	
	// now the axes
	if ((a <= 0) && (b >= 0)) yAxisPosition = theGraph.yLabelMargin + Math.round((-a)*canvasWidth/(b-a));
else yAxisPosition = -1;
	if ((c <= 0) && (d >= 0)) xAxisPosition = screenCoords(theGraph,0,0)[1];
else xAxisPosition = -1;

// alert("here");


	} // if okToRoll
 
} // maheGraph2



// ************** GRAPH in EXCANVAS *************



function refreshGraph()  {
// nothing here
} // End of refreshGraph




function lineStyler(col,isAlpha, percent) {
var colr, colg, colb;
if ((col == "white")||(col == "")) {colr = 255; colg = 255; colb = 255}
else if (col == "magenta") {colr = 255; colg = 0; colb = 255}
else if (col == "darkviolet")  {colr = 148; colg = 0; colb = 211}
else if (col == "teal")  {colr = 0; colg = 128; colb = 128}
else if (col == "limegreen")  {colr = 50; colg = 205; colb = 50}
else if (col == "mediumseagreen")  {colr = 60; colg = 179; colb = 113}
else if (col == "yellow")  {colr = 255; colg = 255; colb = 0}
else if (col == "black")  {colr = 0; colg = 0; colb = 0}
else if (col == "blue")  {colr = 0; colg = 0; colb = 255}
else if (col == "royalblue")  {colr = 65; colg = 105; colb = 255}
else if (col == "lightblue")  {colr = 176; colg = 216; colb = 230}
else if (col == "red")  {colr = 255; colg = 0; colb = 0}
else if (col == "green")  {colr = 0; colg = 255; colb = 0}
else if (col == "aqua")  {colr = 53; colg = 243; colb = 195}
else if (col == "purple")  {colr = 128; colg = 0; colb = 128}
else if (col == "grey")  {colr = 100; colg = 100; colb = 100}
else if (col == "pink")  {colr = 255; colg = 192; colb = 203}
else if (col == "hotpink")  {colr = 255; colg = 105; colb = 180}
else if (col == "orange")  {colr = 255; colg = 165; colb = 0}
else if (col == "coral")  {colr = 255; colg = 127; colb = 80}
else {colr = 0; colg = 0; colb = 0} // black default
var style = "rgb(" + colr + "," + colg + "," + colb + ")";
if(isAlpha) style = "rgba(" + colr + "," + colg + "," + colb + "," + percent + ")";
return(style);
} // lineColor

// ************** SEGMENT *************
// creates a clipped segment in the window
// note that the segment is automatically clipped by excanvas 
// so there is no work for us here
function segment(theGraph, x1,y1,x2,y2, col) {
var screen1 = screenCoords(theGraph, x1, y1);
var screen2 = screenCoords(theGraph, x2, y2);

// do some clipping for Windoze
var xMin = theGraph.window[0];
var xMax = theGraph.window[1];
var yMin = theGraph.window[2];
var yMax = theGraph.window[3];
var noGo = false;
if ((y1 > yMax) && (y2 > yMax)) noGo = true;
else if ((y1 < yMin) && (y2 < yMin)) noGo = true;
else if  ((x1 > xMax) && (x2 > xMax)) noGo = true;
else if  ((x1 < xMin) && (x2 < xMin)) noGo = true;
if (!noGo) {
	
	var x1bar = screen1[0];
	var x2bar = screen2[0];
	var y1bar = screen1[1];
	var y2bar = screen2[1];
	var style = [lineStyler(col)].join("");
	theCanvas = document.getElementById(theGraph.canvaslabel);
	ctx = theCanvas.getContext("2d");
	ctx.strokeStyle = style;

	ctx.beginPath();
	ctx.moveTo(x1bar, y1bar);
	ctx.lineTo(x2bar, y2bar);
	ctx.stroke();
	ctx.closePath();
	}// if not noGo

} // segment


// ************** Adaptive segment *************
// recursive version for pathalogical functions
function adaptiveSegment(theGraph, x1,y1,x2,y2, theFunction, col) {
// theFunction needs to be parsed
// the slope of the segment last drawn is stored in theGraph.MiscVal[0];
// the one before that is in [1]
var xMin = theGraph.window[0];
var xMax = theGraph.window[1];
var yMin = theGraph.window[2];
var yMax = theGraph.window[3];
var noGo = false;
if ((y1 > yMax) && (y2 > yMax)) noGo = true;
else if ((y1 < yMin) && (y2 < yMin)) noGo = true;
else if  ((x1 > xMax) && (x2 > xMax)) noGo = true;
else if  ((x1 < xMin) && (x2 < xMin)) noGo = true;
if (!noGo) {
	var theSlope = (y2-y1)/(x2-x1);
	var mustSubdivide = false;
	if ((Math.abs(theSlope-theGraph.MiscVal[0]) > .5) || (Math.abs(theSlope-	theGraph.MiscVal[1]) > .5)) mustSubdivide = true; // abrupt slope change 
	var screen1 = screenCoords(theGraph, x1, y1);
	var screen2 = screenCoords(theGraph, x2, y2);
	var x1bar = screen1[0];
	var x2bar = screen2[0];
	var y1bar = screen1[1];
	var y2bar = screen2[1];
	var midPointBad = false; var hitBottom = false;
	var epsilon = theGraph.minDetlaXFactor*(theGraph.window[1]- theGraph.window[0]);
	var x3 = .7*x1 + .3*x2;
	x = x3; 
	var y3 = checkEval(theFunction);
	var x4 = .3*x1 + .7*x2;
	x = x4;
	var y4 = checkEval(theFunction);
	var xm = (x1+x2)/2; 
	x = xm;
	var ym = checkEval(theFunction);
	
	if  (  isNaN(y3) || isNaN(y4) ) midPointBad = true;
	else {
		var screen3 = screenCoords(theGraph, x3, y3);
		var x3bar = screen3[0];
		var y3bar = screen3[1];
		var delta3 = Math.abs(.7*y1bar+.3*y2bar - y3bar);
		var screen4 = screenCoords(theGraph, x4, y4);
		var x4bar = screen4[0];
		var y4bar = screen4[1];
		var delta4 = Math.abs(.3*y1bar+.7*y2bar - y4bar);
	
		
		} 
	if ( ( (!mustSubdivide) && (delta3 < 1)&& (delta4 < 1)&& (Math.abs(y2bar - y1bar) < 3) && (!midPointBad) ) || ((x2bar-x1bar)*(x2bar-x1bar)  < epsilon*epsilon) ) {
	if ((x2bar-x1bar)*(x2bar-x1bar)  < epsilon*epsilon) hitBottom = true;
	screen1 = screenCoords(theGraph, x1, y1);
	screen2 = screenCoords(theGraph, x2, y2);
	x1bar = screen1[0];
	x2bar = screen2[0];
	y1bar = screen1[1];
	y2bar = screen2[1];
	var style = [lineStyler(col)].join("");
	theCanvas = document.getElementById(theGraph.canvaslabel);
	ctx = theCanvas.getContext("2d");
	ctx.strokeStyle = style;
	ctx.beginPath();
	ctx.moveTo(x1bar, y1bar);
	ctx.lineTo(x2bar, y2bar);
	ctx.stroke();
	ctx.closePath();
	theGraph.MiscVal[1] = theGraph.MiscVal[0];
	theGraph.MiscVal[0] = (y2-y1)/(x2-x1);
	}
else {
numberTesting += 1;
document.getElementById("traceCoords" + theGraph.id).innerHTML = numberTesting.toString() + ",  " + hitBottom;
	adaptiveSegment(theGraph, x1,y1,x3,y3, theFunction, col);
	adaptiveSegment(theGraph, x3,y3,x4,y4, theFunction, col);
	adaptiveSegment(theGraph, x4,y4,x2,y2, theFunction, col);
	}

} // if not noGo
} // adaptiveSegment




function rememberValues() {
if (document.theFormC.y1x1.value != "") {
	var theInstruction = ""; // a javascript instuction
	var doIt = 0; // a dummy variable
	for (var i = 1; i <= maxnumX; i++) {
		for (var j = 0; j <= maxnum; j++) {
		if (j > 0) theInstruction = " theValues[i][j] = document.theFormC.y"+j+"x"+i+".value";
		else theInstruction = " theValues[i][j] = document.theFormC.x"+i+".value";
		doIt = eval(theInstruction);
		} // j
	} // i
} // IF THERE IS SOMETHING IN THE FIRST CELL
} // remember values

function bringBackValues() {
	if (document.theFormC.y1x1.value == "") {
		var theInstruction = ""; // a javascript instuction
		var doIt = 0; // a dummy variable
		for (var i = 1; i <= maxnumX; i++) {
			for (var j = 0; j <= maxnum; j++) {
			if (j > 0) theInstruction = " document.theFormC.y"+j+"x"+i+".value = theValues[i][j]";
			else theInstruction = " document.theFormC.x"+i+".value = theValues[i][j]";
			doIt = eval(theInstruction);
			} // j
		} // i
	} // if there is nothing in the first cell
} // remember values


// ********* Added Routines and globals for Plotting Points
var plottingPoints = false;
var tab = unescape( "%09" );	
var cr = unescape( "%0D" );	
var lf = unescape( "%0A" );
var semicolon = unescape( '%3B' );
var comma = ",";
var textareaText = '';
var maxNumPoints = 100; 
var numPoints = 0;
var thePlottedPoints = new makeArray2(maxNumPoints,2);
var yMaxPoints = 0;
var yMinPoints = 0;
var xHeight = 4; // half-height of the plotted Xs
var dotRadius = 4; // radius of end-point dots

function rememberValuesPoints() {
if (stripSpaces(document.theFormP.thePoints.value) != '')
textareaText = document.theFormP.thePoints.value;
} // remember values

function restoreValuesPoints() {
if (stripSpaces(document.theFormP.thePoints.value) == '')
document.theFormP.thePoints.value = textareaText;
} // restore values

function readInTextarea() {
// reads in points and calculates maximum and minimum y coords 
var theString = document.theFormP.thePoints.value;
theString = stripSpaces(theString);
theString = replaceChar(theString,comma,tab);
theString = replaceChar(theString,semicolon,cr);
theString = replaceChar(theString,lf,cr);
// now get rid of strings of more than one tab and one cr's in a row
var doubletab = true; var doublecr = true;
while ( (doubletab) || (doublecr) )
	{
	if (checkString(theString,tab+tab,false) == -1) doubletab = false;
	else theString = replaceSubstring(theString,tab+tab,tab);
	if (checkString(theString,cr+cr,false) == -1) doublecr = false;
	else theString = replaceSubstring(theString,cr+cr,cr);
	} // while
theString = replaceSubstring(theString,tab+cr,cr); // get rid of tab + crs
var xyPoints = parser(theString,cr);
var thePoint = new Array;
numPoints = xyPoints[0];
if (theString.indexOf(tab) == -1) numPoints = 0; 
if (numPoints > 0) {
	plottingPoints = true;
	for (var i = 1; i <= numPoints; i++) {
		thePoint = parser(xyPoints[i], tab);
		thePlottedPoints[i][1] = parseFloat(thePoint[1]);
		thePlottedPoints[i][2] = parseFloat(thePoint[2]);
		} // i

	// now compute y max and min for these
	yMaxPoints = thePlottedPoints[1][2];
	yMinPoints = yMaxPoints;
	for (var i = 1; i <= numPoints; i++) {
		try
			{
 			if (thePlottedPoints[i][2] > yMaxPoints) yMaxPoints = thePlottedPoints[i][2];
			else if (thePlottedPoints[i][2] < yMinPoints) yMinPoints = thePlottedPoints[i][2];
			}
			catch (error)
			{ 
			}
		} // i
//	alert("numPOints = " + numPoints + "  ; yMax = " + yMaxPoints + "  ; yMin = "+ yMinPoints);
	// now scale up a bit so that not on the edge
	yMinPoints -= .1*Math.abs(yMinPoints);
	yMaxPoints += .1*Math.abs(yMaxPoints);

	} // if more than 0 points
else plottingPoints = false;
} // readInTextarea

function putX(theGraph, x1,y1) {
var xMin = theGraph.window[0];
var xMax = theGraph.window[1];
var yMin = theGraph.window[2];
var yMax = theGraph.window[3];
// alert(xMin +" " + xMax +" " +  yMin+" " +  yMax);

var theWidth = theGraph.numX; 
var theHeight = theGraph.numY;
screen1 = screenCoords(theGraph, x1, y1);
var x1bar = screen1[0];
var y1bar = screen1[1];
// alert(x1bar);
// alert(theGraph.canvaslabel);
theCanvas = document.getElementById(theGraph.canvaslabel);
// alert(theCanvas);
ctx = theCanvas.getContext("2d");
ctx.strokeStyle = lineStyler(theGraph.pointsColor);
ctx.beginPath();

ctx.moveTo(x1bar-xHeight, y1bar-xHeight);
ctx.lineTo(x1bar+xHeight, y1bar+xHeight);
ctx.stroke();
ctx.closePath();
ctx.beginPath();
ctx.moveTo(x1bar+xHeight, y1bar-xHeight);
ctx.lineTo(x1bar-xHeight, y1bar+xHeight);
ctx.stroke();
ctx.closePath();

} // putX

function putDot(theGraph, x1,y1, color,isOpen) {
var xMin = theGraph.window[0];
var xMax = theGraph.window[1];
var yMin = theGraph.window[2];
var yMax = theGraph.window[3];
// alert(xMin +" " + xMax +" " +  yMin+" " +  yMax);

var theWidth = theGraph.numX; 
var theHeight = theGraph.numY;
screen1 = screenCoords(theGraph, x1, y1);
var x1bar = screen1[0];
var y1bar = screen1[1];
// alert(x1bar);
// alert(theGraph.canvaslabel);
theCanvas = document.getElementById(theGraph.canvaslabel);
// alert(theCanvas);
ctx = theCanvas.getContext("2d");

ctx.beginPath();
if(!isOpen) {
	ctx.fillStyle = lineStyler(color);
	ctx.arc(x1bar, y1bar, dotRadius, 0, 2*Math.PI,true); 
	ctx.fill();
	}
else {
	ctx.fillStyle = "white";
	ctx.arc(x1bar, y1bar, dotRadius, 0, 2*Math.PI,true); 
	ctx.fill();
	ctx.strokeStyle = lineStyler(color);
	ctx.arc(x1bar, y1bar, dotRadius, 0, 2*Math.PI,true);
	ctx.stroke();
	}

ctx.closePath();

} // putDot


function putBar(theGraph, x1, x2, y1, y2, col, opac) {
if (y2 > y1) {var yt = y1; y1 = y2; y2 = yt}
var realCoords1 = screenCoords(theGraph, x1, y1);
var realCoords2 = screenCoords(theGraph, x2, y2);
var x1b = realCoords1[0];
var y1b = realCoords1[1];
var x2b = realCoords2[0];
var y2b = realCoords2[1];
theCanvas = document.getElementById(theGraph.canvaslabel);
ctx = theCanvas.getContext("2d");
if (opac == -1) ctx.fillStyle = lineStyler("white"); // white solid
else ctx.fillStyle = lineStyler(col, true, opac);
ctx.fillRect (x1b,y2b, x2b-x1b, y1b-y2b);
ctx.strokeStyle = lineStyler(col);
ctx.strokeRect(x1b,y2b, x2b-x1b, y1b-y2b); // boundary
	} // putBar


//** detecting mouse coordinates on the canvas

function getElementPosition(elemID){
var offsetTrail = document.getElementById(elemID);
var offsetLeft = 0;
var offsetTop = 0;
while (offsetTrail){
offsetLeft += offsetTrail.offsetLeft;
offsetTop += offsetTrail.offsetTop;
offsetTrail = offsetTrail.offsetParent;
}
if (navigator.userAgent.indexOf('Mac') != -1 && typeof document.body.leftMargin != 'undefined'){
offsetLeft += document.body.leftMargin;
offsetTop += document.body.topMargin;
}
return {left:offsetLeft,top:offsetTop};
}


function alertCoord(e,theGraph,n_decimals) {

	var canvPos = getElementPosition(theGraph.canvaslabel);
// alert(canvPos);
	  if( !e ) {
	    if( window.event ) {
	      //Internet Explorer
	      e = window.event;
	    } else {
	      //total failure, we have no way of referencing the event
	      return;
	    }
	  }
	  if( typeof( e.pageX ) == 'number' ) {
	    //most browsers
	    var xcoord = e.pageX;
	    var ycoord = e.pageY;
	  } else if( typeof( e.clientX ) == 'number' ) {
	    //Internet Explorer and older browsers
	    //other browsers provide this, but follow the pageX/Y branch
	    var xcoord = e.clientX-1;
	    var ycoord = e.clientY-1;
	    var badOldBrowser = ( window.navigator.userAgent.indexOf( 'Opera' ) + 1 ) ||
	     ( window.ScriptEngine && ScriptEngine().indexOf( 'InScript' ) + 1 ) ||
	     ( navigator.vendor == 'KDE' );
	    if( !badOldBrowser ) {
	      if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
	        //IE 4, 5 & 6 (in non-standards compliant mode)
	        xcoord += document.body.scrollLeft;
	        ycoord += document.body.scrollTop;
	      } else if( document.documentElement && ( document.documentElement.scrollLeft 	|| document.documentElement.scrollTop ) ) {
	        //IE 6 (in standards compliant mode)
	        xcoord += document.documentElement.scrollLeft;
	        ycoord += document.documentElement.scrollTop;
	      }
	    }
	  } else {
	    //total failure, we have no way of obtaining the mouse coordinates
	    return;
	  }
	xcoord -= canvPos.left;
	ycoord -= canvPos.top;
	// window.alert('Mouse coordinates are ('+xcoord+','+ycoord+')');
	// now get actual coordinates
	var a = theGraph.window[0];
	var b = theGraph.window[1];
	var c = theGraph.window[2];
	var d = theGraph.window[3]; 
	var theWidth = theGraph.numX  - theGraph.yLabelMargin;
	var theHeight = theGraph.numY - theGraph.xLabelMargin; 


	// var theInsta = "var a = " + name + ".a";
	// var theInstb = "var b = " + name + ".b";
	// var theInstc = "var c = " + name + ".c";
	// var theInstd = "var d = " + name + ".d";
	// var theInstCW = "var theWidth = " + name + ".numX";
	// var theInstCH = "var theHeight = " + name + ".numY";
	// eval(theInsta); eval(theInstb); eval(theInstc); eval(theInstd);
	// eval(theInstCW); eval(theInstCH);
// alert(a + "," + b + ","  + c + ","  + d  + ","  + theWidth );
	var xAdjusted = xcoord- theGraph.yLabelMargin;
	theGraph.xScreen = xAdjusted;
	theGraph.yScreen = ycoord;
	theGraph.xActual = roundDec(a + xAdjusted*(b-a)/theWidth, n_decimals);
	theGraph.yActual = roundDec((theHeight-ycoord)*(d-c)/theHeight + c, n_decimals);
	if ((xAdjusted >= 0) && (xAdjusted <= theWidth)  && (ycoord <= theHeight) ) {
	document.getElementById("traceCoords" + theGraph.id).innerHTML =  '('+ theGraph.xActual +', '+ theGraph.yActual +')'}

} // alertCoord


function canDragBars(theGraph) {
theGraph.onclick = dealWithClick(theGraph);
theGraph.onmousedown = dealWithMouseDownBars(theGraph)

theGraph.onmouseup = document.getElementById("traceCoords" + theGraph.id).innerHTML = "up";

}

function dealWithClick(theGraph) {
theGraph.xClicked = theGraph.xScreen;
theGraph.yClicked = theGraph.yScreen;


}

function dealWithMouseDownBars(theGraph) {
// check if the click occurred near the top of a specific bar
// alertCoord(arguments[0], theGraph,2);
var theXcoord = theGraph.xScreen;
var theYcoord = theGraph.yScreen;
document.getElementById("traceCoords" + theGraph.id).innerHTML = "clicked";
// alert(theXcoord + "," + theYcoord);
var numBarGraphs = theGraph.bars.length;
for (var n = 0; n<= numBarGraphs-1; n++) {
	var h1 = theGraph.bars[n][2];
	var h2 = theGraph.bars[n][3];
	var theXBarCoords = theGraph.bars[n][0];
	var theYBarCoords = theGraph.bars[n][1]; 
	var xLaft, xRight, y1, x2, yLower;
//alert(theXBarCoords);
	for (var i = 0; i <= theXBarCoords.length-1; i++) { 
//alert(i);
		xLeft = theXBarCoords[i] - h1; // left edge
		xRight = theXBarCoords[i] + h2;
		y1 = theYBarCoords[i];
		var SCL = screenCoords(theGraph, xLeft, y1);
		var SCR = screenCoords(theGraph, xRight, y1);
		if ( (theXcoord >= SCL[0]) && (theXcoord <= SCR[0]) && (theYcoord >= SCL[1] - 5) && (theYcoord <= SCL[1] + 5) ) document.getElementById("traceCoords" + theGraph.id).innerHTML = "success";
	
		
		} // i
	} // n




} // dealWithMouseDownBars