<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
.myButtons{font-size:80%;font-family:Geneva,Helvetica;background:#e8e888;background:linear-gradient(#cccccc,#e8e888)}
.myButtonsHov{background:#e8e84B}
</style>



<title></title>
<script type="text/javascript">
    var theLanguage = parent.theLanguage;
    var pathPrefix = ".."; // path to base directory
    function addText(x,y){return(theLanguage=="en")?x:y}
    

</script>
<script type="text/javascript" src = "../globalScripts.js">
</script>
<script type="text/javascript" src = "../utilsV5.js">
</script>
<script type="text/javascript" src = "../SVGGrapher/SVGGraphV1_5.js"></script>
<script type="text/javascript">
//<![CDATA[
graphDocNameGiven = true;
var theDocObj=document;
var grapher1 = new grapher("grapher1",250, 180);


function getQuery(inSt) {
	if (typeof inSt != "undefined") {var st=inSt.indexOf("?");qSt=inSt.substring(st+1);}
	else qSt = window.location.search.substring(1);
	if (qSt=="") return([]);
	var qVars = qSt.split("&"), outArr=[];
	for (var i=0;i<qVars.length;i++) outArr[i] = qVars[i].split("=");
	return outArr;
}

function getQueryVar(varName,fromString) {
	// fromString is optional; wil be the current page if not suplied
	if (typeof fromString != "undefined")  var A=getQuery(fromString);
	else var A=getQuery();
	for (var i=0;i<A.length;i++) {if (A[i][0] == varName)  return A[i][1]}
	return(""); 
} //getQueryVariable
	
	
	

with(grapher1) {
				// tracing info
				tracing=(getQueryVar("drawcurve")=="true");
				numTraceSteps=(getQueryVar("drawcurve")=="true")?32:8; // based on with of the graph as 8 units;
				decPlacesX=0; // for displaying coords
				decPlacesY=0;
				traceStep=.25; // this gets reset in traceGraph...
				// end of tracing info
				

		
		stopOnCutoff=true;
		backgroundColor = "white";
		surroundColor = "transparent";
	

		linesColor="#999999"; // line segments
		
		//showCoords = 0;
		showScalex=true;
		showScaley=true;
		xLabelFontSize = yLabelFontSize = 12;
		xLabelsBelow = true;
		//yLabelsLeft  = true;
		yLabelsAlignRight=true;
		nudgeXValsY=0;
		nudgeYValsX=-5;
		xValuesShown = [-5,0,5,10,15];
		//yValuesShown = [2,4,6,8,10,12];
		yValuesRange=[2,12]
		xGrid="on";
    	yGrid="on";
		xGridStep = 2.5;
		yGridStep = 2;
		
        xAxisLabelStyle="font-size:16px;font-style:italic";
		yAxisLabelStyle="font-size:16px;font-style:italic";
		yAxisLabel="y";
		xAxisLabel="x";
		clipMargins=[0,0,0,5];
		xAxisLabelOffsets=[3,-3];
		yAxisLabelOffsets=[2,7];
		
		arrowLength=13;
		curveWt=1.5;
		topMargin=10;
		pointsWt=1.5; // thickness of plotted points typeically twice as thick as curves
		axisWt=1 // axis thickness 
		window = [-5,15,-1,14];
		var theCurveEq=""
        if(getQueryVar("ex")=="1")theCurveEq="12/(1+2.3*1.5^(-x))";
		plottedCurves=[ ["12",window[0],window[1],"",""], [theCurveEq,window[0],window[1],"arrow","arrow"]];
        curvesColors=["silver","#cc0044","green"];
        pointsColor="#cc0044";
	    
		
	clickAccX=.25;
	clickAccY=.25;
	decPlacesX=(getQueryVar("drawcurve")=="true")?2:0;
	decPlacesY=(getQueryVar("drawcurve")=="true")?2:0;

	isPopup=false;
	popupURL="graphWindow.html"
	pointsPerCurve = 1000;
	
    
	plottedPointsX=[,2.05];
	plottedPointsY=[,6];
	//parent.evalFuncQuick(theCurveEq,2.05,"x")
	gridColor = "grey";
	

		
    

	}
xHeight = 3;
dotRadius=3;
var deltaYShift=(SAFJS)? 2:0;




function initialActions() {

setUpGraph(grapher1);
var graphDoc = getDoc (grapher1);
var graphElt= graphDoc.getElementById("myGraph");

graphElt.setAttributeNS(null,"viewBox"," 0 0 " + grapher1.totWdth + " " + grapher1.totHt);

//plotPoints(grapher1,"x",true,"",0, -4); // plotPoints(theGraph, type, showLabels, labelType, dX,dY)
plotPoints(grapher1,"x");
grapher1.arrowLength=9; //reset for smaller arrow on curve
plotAllCurves(grapher1);
putText(grapher1, "(2.05, 6)", "font-size:14px", 12,  4, 6.2,   -12, -6, false, true,"",true,false,false,2);
//putText(grapher1, "=", "font-size:14px", 12,  1.9,4.4,   0, -8, false, true,"",true,false,false,2);
//putText(grapher1, "N", "font-style:italic;font-size:14px", 12,  2.3,4.4,   4, -6, false, true,"",true,false,false,2);

//putText(grapher1, "0", "font-size:14px", 12,  0,0,   -12, -6, false, true,"",true,false,false,2);
//

// now put a trace point somewhere (code from dealWithMouseDownTrace)
 //var p=putX(grapher1, 1,10, grapher1.traceColor,2.5,"tracepoint_grapher1");
//			grapher1.traceX=1;
//			grapher1.traceY=1;
//			grapher1.traceIndex=p;
//			traceGraph(grapher1,1,true); // puts in guide lines, resets coords shown etc and keeps track of bookeeping
//			traceGraph(grapher1,0,true)


//function putText(theGraph, inStr, theStyle, theFontSize,  x1,y1, offsetX, offsetY, areScreenCoords, overrideBorders,bgColor,centering,isForAxes,isTex,heightFactor)




//
//putDot(theGraph, x1,y1, color,isOpen, radius,fillColor) 
// plotPoints(grapher1, "x", false, '')
//showSVG(grapher1)

document.getElementById("coordsword").innerHTML=addText("Coordinates","Cooredenadas")

}





// NOTE
// onmousedown="if (event.preventDefault) event.preventDefault()"
// the above prevents the SVG image from being dragged around in Firefox and some other browsers
//]]>
</script>
</head>
<body onload="initialActions()">
<div id = "scratch" style="font-size:5px"></div><span id = "ruler"></span>
<div id="grapher1Div" style="margin-top:0px;margin-bottom:0px" onmousemove="showCoords(event,this,grapher1,false);" onmousedown=" dealWithMouseDownTrace(event,this,grapher1,true)">
<svg xmlns="http://www.w3.org/2000/svg"
  xmlns:xlink="http://www.w3.org/1999/xlink" 
  width="300" height="250" id="myGraph">
<defs id="graphdefs_grapher1">
<marker id="arrowHead_grapher1" viewBox="0 0 10 10" refX="10" refY="5" 
    markerUnits="strokeWidth" orient="auto"
    markerWidth="40" markerHeight="20">
    <polyline id="myArr_grapher1" points="0,0 10,5 0,10 3,6 0,5 3,4" />
</marker>



<marker id="guideArrow_grapher1" viewBox="-6 -6 12 12" refX="4" refY="0" 
    markerUnits="strokeWidth" orient="auto"
    markerWidth="20" markerHeight="10">
    <polyline id="myArrGA_grapher1" refX = "2" refY="0" points="-2,0 -5,5 5,0 -5,-5" />
</marker>

<marker id="guideArrowVert_grapher1_grapher1" viewBox="-6 -6 12 12" refX="10" refY="0" 
    markerUnits="strokeWidth" orient="auto"
    markerWidth="20" markerHeight="10">
    <polyline id="myArrGA_grapher1" refX = "2" refY="0" points="-2,0 -5,5 5,0 -5,-5" />
</marker>




<!-- -2,0 -5,5 5,0 -5,-5  -->
	
<clipPath id="rectClip_grapher1">
    <rect id="cliprect_grapher1" width="350" height="250" x="25" y="25" fill="white" />
    <!-- The above is adjusted by the js in SVGGraph --> 
</clipPath>
</defs>

<g id="firstGroup_grapher1">
	<rect id="gSurround_grapher1" width="400" height="250" x="0" y="0" fill="lightblue"  style="cursor:crosshair"/>
	<rect id="grid_grapher1" width="350" height="225" x="25" y="25" fill="white"  style="cursor:crosshair"/>
</g>
<g id="dots_grapher1">
</g>
<g id="gridGroup_grapher1">
</g>
<g id="curves_grapher1">
</g>

<g id="squares_grapher1">
</g>
<g id="xs_grapher1">
</g>
<g id="tracepoint_grapher1">
</g>
<g id="lines_grapher1">
</g>
<g id="guideLines_grapher1">
</g>
<g id="barlabels_grapher1">
</g>
<g id="arcs_grapher1">
</g>
</svg>
</div>

<center>
	<div style="font-family:Arial;color:indianred;font-size:12px; margin-top:0px; margin-bottom:5px">
		<span id="coordsword"></span>: <span id="traceCoordsgrapher1">(0,  &#160; 0)</span>
	</div>
	
	
       <button id="lefttrace" class="myButtons" onmouseover="this.style='myButtonsHov'" onmouseout="clearTimeoutsandIntervals();this.class='myButtons'" onmousedown="delayTrace(grapher1,0, true)" onmouseup="clearTimeoutsandIntervals()">&#8592;</button>
       <button id="righttrace"  class="myButtons"  onmousedown="delayTrace(grapher1,1, true)" onmouseout="clearTimeoutsandIntervals();" onmouseup="clearTimeoutsandIntervals()">&#8594;</button>
       <span id="magicbutton"></span>

       
       
   </center>


<script>
    //<![CDATA[
	document.getElementById("magicbutton").innerHTML='<button id="checkbutton" onclick="showSVG(grapher1)">SVG Source</button>';
    //]]>
</script>








</body>
</html>
