function makeGrid(size)
{
	for(var k=Grid.childNodes.length-1 ; k>=0;k--)
	{
		Grid.removeChild(Grid.childNodes.item(k))
	}

	var useLength=size
			var lineCnt=size/10
			var grid=useLength/lineCnt
			var strokeThick="blue"
			var strokeThin="gray"
			var centerColor="red"

			var dX=parseInt(size/grid)
			var dY=parseInt(size/grid)
		//----vertical start line---
			var x1V=-10
			var y1V=-10
			var x2V=-10
			var y2V=size

		//---horizontal start line---
			var x1H=-10
			var y1H=-10
			var x2H=size
			var y2H=-10

		for(i=0;i<lineCnt;i++)
		{
			stroke=strokeThin
			var strokeWidth=.2
			num=i/2+""
			if(num.indexOf(".")==-1)
			{
				stroke=strokeThick
				strokeWidth=.4
			}

			if(i==10 || i==20 || i==30 || i==40 || i==50|| i==60|| i==70|| i==80) strokeWidth=1
			style="stroke:"+stroke+";fill:none;stroke-width:"+strokeWidth

			if(i<dX)
			{
				vert=Wizard.createElement("line")
				x1V+=grid
				x2V+=grid
				vert.setAttribute("x1",x1V)
				vert.setAttribute("y1",y1V)
				vert.setAttribute("x2",x2V)
				vert.setAttribute("y2",y2V)
				vert.setAttribute("style",style)
				vert.setAttribute("id","grid")
 				Grid.appendChild(vert)
			}
			if(i<dY)
			{
				horiz=Wizard.createElement("line")
				y1H+=grid
				y2H+=grid
				horiz.setAttribute("x1",x1H)
				horiz.setAttribute("y1",y1H)
				horiz.setAttribute("x2",x2H)
				horiz.setAttribute("y2",y2H)
				horiz.setAttribute("style",style)
				horiz.setAttribute("id","grid")
 				Grid.appendChild(horiz)
			}
		}


			//---add center point-----
			//---increase size for symbol centering---
			grid=15
			var centerPntGridG=Wizard.createElement("g")
			centerPntGridG.setAttribute("id","centerPntGridG")

			var centerVert= Wizard.createElement("line")
			var centerHoriz= Wizard.createElement("line")
			//var centerCircle= Wizard.createElement("circle")
			var strokeWidth=1
			var style="stroke:"+centerColor+";fill:none;stroke-width:"+strokeWidth
			var centerX=0+.5*size
			var centerY=0+.5*(size)
			/*
			centerCircle.setAttribute("id","centerCircle")
			centerCircle.setAttribute("style",style)
			centerCircle.setAttribute("r",grid/2)
			centerCircle.setAttribute("cx",centerX)
			centerCircle.setAttribute("cy",centerY)
			centerPntGridG.appendChild(centerCircle)
			*/
			centerVert.setAttribute("id","centerVert")
			centerVert.setAttribute("style",style)
			centerVert.setAttribute("x1",centerX)
			centerVert.setAttribute("y1",centerY-grid)
			centerVert.setAttribute("x2",centerX)
			centerVert.setAttribute("y2",centerY+grid)
			centerPntGridG.appendChild(centerVert)

			centerHoriz.setAttribute("id","centerHoriz")
			centerHoriz.setAttribute("style",style)
			centerHoriz.setAttribute("x1",centerX-grid)
			centerHoriz.setAttribute("y1",centerY)
			centerHoriz.setAttribute("x2",centerX+grid)
			centerHoriz.setAttribute("y2",centerY)
			centerPntGridG.appendChild(centerHoriz)
			Grid.appendChild(centerPntGridG)
}

function round2(num)
{
	//---return 1 decimal places---
	var dp2=Math.round(num*10)/10
	return dp2
}

function round0(num)
{
	//---return 0 decimal places---
	var dp0=Math.round(num)
	return dp0
}
var DwgSize=300
function svgSize(size)
{
	if(size==300)
	{
		size600Check.checked=false
		size800Check.checked=false
		svgSpan.style.width=300
		svgSpan.style.height=300
		makeGrid(300)
		DwgSize=300
	}

	else if(size==600)
	{
		size300Check.checked=false
		size800Check.checked=false
		svgSpan.style.width=600
		svgSpan.style.height=600
		makeGrid(600)
		DwgSize=600
	}

	else if(size==800)
	{
		size600Check.checked=false
		size300Check.checked=false
		svgSpan.style.width=800
		svgSpan.style.height=800
		makeGrid(800)
		DwgSize=800
	}
}

function showHelp()
{
	helpSpan.style.visibility="visible"
	helpSpan.style.width=350*FactorW
	helpSpan.style.height=450*FactorW
	thumbSpan.style.visibility="hidden"
	topTable.style.width="95%"
	thumbSpan.style.width=350*FactorW

}
function hideHelp()
{

	helpSpan.style.visibility="hidden"
	helpSpan.style.width=1
	helpSpan.style.height=1
	thumbSpan.style.visibility="visible"
	topTable.style.width="80%"
	thumbSpan.style.width=150*FactorW
}

function fillRule()
{
	if(fillRuleRadio[0].checked==true)
		YellowBrickRoad.setAttribute("fill-rule","evenodd")
	else
		YellowBrickRoad.setAttribute("fill-rule","nonzero")
}
//------popup----
//---create an HTML Popup---
var pop = window.createPopup();
var popBox = pop.document.body;
popBox.style.fontSize=6

function showPop()
{
	popBox.innerHTML=popHtmlSpan.innerHTML
	var popWidth =100*FactorW
	var popHeight = popBox.scrollHeight;

	//---gets the upper left/top of the document--
	var windowX = window.screenLeft;
	//var windowY = window.screenTop+containerSpan.offsetTop;
	var windowY = window.screenTop

	var popX = windowX + event.clientX-140
	var popY = windowY + event.clientY-30

	pop.show(popX,popY,popWidth,popHeight);
	//---reread to force actual height---

	var popWidth = popBox.scrollWidth;
	var popHeight = popBox.scrollHeight;
	pop.show(popX,popY,popWidth,popHeight);

}

function showChangePop()
{
	popBox.innerHTML=popHtmlChangeSpan.innerHTML
	var popWidth =100*FactorW
	var popHeight = popBox.scrollHeight;

	//---gets the upper left/top of the document--
	var windowX = window.screenLeft;
	//var windowY = window.screenTop+containerSpan.offsetTop;
	var windowY = window.screenTop

	var popX = windowX + event.clientX-140
	var popY = windowY + event.clientY-30

	pop.show(popX,popY,popWidth,popHeight);
	//---reread to force actual height---

	var popWidth = popBox.scrollWidth;
	var popHeight = popBox.scrollHeight;
	pop.show(popX,popY,popWidth,popHeight);

}

function hidePop()
{
	if(PrevHilite)
	{
		var prevSpan=eval("select"+PrevHilite+"Span")
		prevSpan.style.color=''
		prevSpan.style.backgroundColor='white'
		PrevHilite=null
	}
	if(PrevChange)
	{
		var changeSpan=eval("select"+PrevChange+"Span")
		changeSpan.style.backgroundColor='white'
		PrevChange=null
	}
	pop.hide();
}
var SelectNum
var Command
function addCommand(comm)
{
	SelectNum=PrevHilite
	var selectSpan=eval("select"+SelectNum+"Span")
	selectSpan.innerText=comm
	Command=comm
	commSelectAdd()
	hidePop();
	HiliteString+=SelectNum
	selectSpan.style.cursor="hand"
	selectSpan.title="click to change/remove"
}

function changeCommand(comm)
{
	SelectNum=PrevChange
	var selectSpan=eval("select"+SelectNum+"Span")

	selectSpan.innerText=comm
	Command=comm
	commSelectChange(comm)
	hideChangePop();
	HiliteString+=SelectNum
	selectSpan.style.cursor=""
	selectSpan.title=""
	PrevChange=null
}



var PrevChange
function changeRemove(num)
{
	if(HiliteString.indexOf(num)!=-1)
	{
			if(PrevChange)
			{
				var changeSpan=eval("select"+PrevChange+"Span")
				changeSpan.style.backgroundColor='white'
				PrevChange=null
			}

		if(PrevHilite)
		{
			var prevSpan=eval("select"+PrevHilite+"Span")
			prevSpan.style.color=''
			prevSpan.style.backgroundColor='white'
							PrevHilite=null
		}
		showChangePop()
		var selectSpan=eval("select"+num+"Span")
		selectSpan.style.backgroundColor='gainsboro'
		PrevChange=num
	}

}

function hideChangePop()
{
	hidePop()
			if(PrevChange)
			{
				var changeSpan=eval("select"+PrevChange+"Span")
				changeSpan.style.backgroundColor='white'
				PrevChange=null
			}
}

function addPoint()
{
	SelectNum=PrevHilite
	var selectSpan=eval("select"+SelectNum+"Span")
	selectSpan.innerHTML="<span style='font-weight:bold;color:magenta'>+</span>"
	Command="+"
	commAddPoint()
	hidePop();
}

function changeAddPoint()
{
	var selectSpan=eval("select"+SelectNum+"Span")
	selectSpan.innerHTML="<span style='font-weight:bold;color:magenta'>+</span>"
	Command="+"
	commSelectChange()
	hidePop();
}

//---click X to remove----
function remove()
{
	SelectNum=PrevChange
	var selectSpan=eval("select"+SelectNum+"Span")
	selectSpan.innerHTML=""
	Command=""
	commSelectRemove()
	hidePop();
}

var PrevHilite
var HiliteString=""
function hiliteSelect(num)
{

	if(HiliteString.indexOf(num)==-1)
	{
		showPop();

		if(PrevHilite)
		{
			var prevSpan=eval("select"+PrevHilite+"Span")
			prevSpan.style.color=''
			prevSpan.style.backgroundColor='white'

		}
		var selectSpan=eval("select"+num+"Span")
		selectSpan.style.color='white';
		selectSpan.style.backgroundColor='darkblue'
		PrevHilite=num
		if(PrevChange)
		{
			var changeSpan=eval("select"+PrevChange+"Span")
			changeSpan.style.backgroundColor='white'
			PrevChange=null
		}
	}

}

