var ANCHORDIV="<div id='XX1' class='XX2' style='top:0px;left:0px;' onmousedown='AnchorMouseDown(this.id)' onmouseup='AnchorMouseUp(this.id)'></div>";
function MakeAnchorStr(idd,clssn){	var a=ANCHORDIV.replace("XX1",idd);	a=a.replace("XX2",clssn);	return(a);	}

var ie5 = (document.getElementById && document.all);
var ns6 = (document.getElementById && !document.all);
var Xpos,Ypos;
function _STOPPOINT(x,RR,GG,BB)
	{
	this.offset		=x;
	this.opacity	=1;
	this.colorR		=RR;
	this.colorB		=BB;
	this.colorG		=GG;
	}	
function _LinearGradient(x1,x2,y1,y2)
	{
	this.x1		=x1;
	this.y1		=y1;
	this.x2		=x2;
	this.y2		=y2;
	this.stop   =new Array();
	this.stop[0]=new _STOPPOINT(0,		255,128,128);
	this.stop[1]=new _STOPPOINT(0.25,	255,128,0);
	this.stop[2]=new _STOPPOINT(0.75,	255,255,128);
	this.stop[3]=new _STOPPOINT(1,		128,128,255);
	} 
	
function _RadialGradient(x1,x2,y1,y2)
	{
	this.fx		= (x1+x2)/2;
	this.fy		= (y1+y2)/2;
	this.r		= 0;
	this.stop   = new Array();
	if(y2-y1 >x2-x1)this.r=y2-y1;
	else this.r=x2-x1;
	this.r=Math.round(Math.abs(this.r)/2);
	this.stop[0]=new _STOPPOINT(0,		255,128,128);
	this.stop[1]=new _STOPPOINT(0.25,	255,128,0);
	this.stop[2]=new _STOPPOINT(0.75,	255,255,128);
	this.stop[3]=new _STOPPOINT(1,		128,128,255);
	}	
	
function _BoundRect() // circle
	{
	this.x1 =00;
	this.y1 =00;
	this.x2 =60;
	this.y2 =40;  // two dots (X1 Y1) (X2 Y2)
	}
function _BoundRoundRect()
	{
	this.x1 =00;
	this.y1 =00;
	this.x2 =60;
	this.y2 =40;  // two dots (X1 Y1) (X2 Y2)
	this.rx =7;
	this.ry =5;// Four dots (X1, Y1) (X2, Y2) (X1+cx,Y1) (X1,Y1+Cy)
	}		
function _PPPOINT(z,x,y)// moveto line to
	{
	this.type	=z;// 0=move to 1 = line to
	this.x		=x;
	this.y		=y;
	}
function _Curve(x1,y1,x2,y2,x3,y3)// moveto line to
	{
	this.type	=2;// 2= curve
	this.x1		=x1;
	this.y1		=y1;	
	this.x2		=x2;
	this.y2		=y2;
	this.x		=x3;
	this.y		=y3;
	}




function _elementRect()
	{
	this.type			= 2;
	this.BRect			= new _BoundRect();
	this.strokeWidth	= 1;
	this.stroke			= new Array(0,0,0);
	this.strokeType		= 1; // 0 is none 1 is solid color 2 is linear 3 is radial
	this.fillType		= 1;
	this.fill			= new Array(255,255,0);
	this.style			= new Array();
	this.id				= new String();
	this.skewX			= 0;
	this.skewY			= 0;
	this.rotate			= 0;
	this.maxX			= 0;
	this.minX			= 0;
	this.maxY			= 0;
	this.minY			= 0;
	this.zIndex			= 0;
	this.translateY		= 0;
	this.translateX		= 0;
	this.outline		= 0;
	this.draw			= 0;
	}

function _elementEllipse()
	{
	this.type			= 1;
	this.BRect			= new _BoundRect();
	this.strokeWidth	= 1;
	this.stroke			= new Array(0,0,0);
	this.strokeType		= 1; // 0 is none 1 is solid color 1 is linear 2 is radial
	this.fillType		= 1;
	this.fill			= new Array(255,255,0);
	this.style			= new Array();
	this.id				= new String();
	this.skewX			= 0;//Math.PI/2 ;
	this.skewY			= 0;//Math.PI/2 ;
	this.rotate			= 0;
	this.maxX			= 0;
	this.minX			= 0;
	this.maxY			= 0;
	this.minY			= 0;
	this.zIndex			= 0;
	this.translateY		= 0;
	this.translateX		= 0;	
	this.outline		= 0;
	this.draw			= 0;
	}

function _elementRoundRect()
	{
	this.type			= 3;
	this.BRect			= new _BoundRoundRect();
	this.strokeWidth	= 1;
	this.stroke			= new Array(0,0,0);
	this.strokeType		= 1; // 0 is none 1 is solid color 1 is linear 2 is radial
	this.fillType		= 1;
	this.fill			= new Array(255,255,0);
	this.style			= new Array();
	this.id				= new String();
	this.maxX			= 0;
	this.minX			= 0;
	this.maxY			= 0;
	this.minY			= 0;
	this.zIndex			= 0;
	this.skewX			= 0;
	this.skewY			= 0;
	this.rotate			= 0;
	this.translateY		= 0;
	this.translateX		= 0;
	this.outline		= 0;
	this.draw			= 0;
	}
function _elementPath()
	{
	this.type			= 4;
	this.closed			= 1; // 1= close 0 =open
	this.points			= new Array();
	this.strokeWidth	= new Number(1);
	this.stroke			= new Array(0,0,0);
	this.strokeType		= 1; // 0 is none 1 is solid color 1 is linear 2 is radial
	this.fillType		= 1;
	//this.fill			= new Array(255,255,0)
	this.fill			= new Array(0xf0,0xe6,0x8c);
	this.style			= new Array();
	this.id				= new String();
	this.skewX			= 0;
	this.skewY			= 0;
	this.rotate			= 0;
	this.maxX			= 0;
	this.minX			= 0;
	this.maxY			= 0;
	this.zIndex			= 0;
	this.minY			= 0;
	this.translateY		= 0;
	this.translateX		= 0;
	this.outline		= 0;
	this.draw			= 0;
	this.points[0]= new _PPPOINT(0,24,12);
	this.points[1]= new _PPPOINT(1,70,110);
	this.points[2]= new _PPPOINT(1,86,12);
	this.points[3]= new _PPPOINT(1,5,90);
	this.points[4]= new _PPPOINT(1,100,60);
	}

var current_move_object;
var CurrentItem=-1;
var ItemCount=0;
var ItemArray=new Array();
var current_move_function="";

var downX=-10000;
var downY=-10000;


var PathOrient =new Array();

var StrokeColor;


function VIEWMAP()
	{
	GetSvgitems(document.getElementById('ViewportSVG'));
		{
		var mystring="RenderingAll();";
		setTimeout(mystring,5);
		}
	document.getElementById("PAPA").onmousemove=PapaMouseMove;
	}

function RefreshItem(x)
		{
		var m=x;
		var Disflag=3;
		var flagBeg=0;
		DrawingLevel=0;
		CurveAddlevel=0;
		FillSection=new Array();
		
		HBitmapSize[x]=new Array();
		
		Ppoints= new Array();
		NewPpoints= new Array();
		StokeMouseEvent=new Array();
		StrokeColor=RgbToString(ItemArray[x].stroke[0],ItemArray[x].stroke[1],ItemArray[x].stroke[2]);
		ItemMaxX=ItemMaxY=-20000;
		ItemMinX=ItemMinY=20000;
		
		var subPath=0; // many z in the same path
		if(ItemArray[x].fillType>1)
			ProcessGradient(x);
		else
			SwapNeeded=0;
			
		switch(ItemArray[x].type)
			{
			case 1: 
				m=ItemArray[x].BRect;
				CirleAddBot=0;
				CirleAddRight=0;
				DrawEllipse( (m.x1+m.x2)/2 ,  (m.y1+m.y2)/2 , (m.x2- m.x1)/2 ,  (m.y2- m.y1)/2 ,0);
				//MakeOval(m.x1, m.y1,m.x2- m.x1, m.y2- m.y1);
				break;
			case 2: 
				m=ItemArray[x].BRect;
				MakeLine(m.x1, m.y1,m.x2, m.y1);
				MakeLine(m.x2, m.y1,m.x2, m.y2);
				MakeLine(m.x2, m.y2,m.x1, m.y2);
				MakeLine(m.x1, m.y2,m.x1, m.y1);
				break;
			case 3: 
				m=ItemArray[x].BRect;
				MakeLine(m.x1+m.rx, m.y1,						m.x2-m.rx, m.y1);
				MakeLine(m.x2, m.y1+m.ry,						m.x2, m.y2-m.ry);
				MakeLine(m.x2-m.rx, m.y2,						m.x1+m.rx, m.y2);
				MakeLine(m.x1, m.y2-m.ry,						m.x1, m.y1+m.ry);
				CirleAddBot=m.y2-m.y1-m.ry-m.ry;
				CirleAddRight=m.x2-m.x1-m.rx-m.rx;
				DrawEllipse( (m.x1+m.rx) , (m.y1+m.ry) , m.rx , m.ry, 0);
				//MakeOval(m.x1,m.y1,m.rx<<1,m.ry<<1);
				break;
//PATH DRAW				
			case 4:
				m=ItemArray[m].points;
				var cur_x,cur_y;
				var save_x,save_y;
				var tmm2=m.length-1;
				
				for(var c=0;c<=tmm2;c++)
					{
					var a=m[c];
					switch(a.type)
						{
							
						case 1:
/*						
							if(a.y==cur_y)
								{
								var kj=c;
								while(c<tmm2 )
									if( m[c+1].type==1 && m[c+1].y==cur_y) c++;
									else break;
								if(c>kj) {a=m[c];}
								}
							else	
							if(a.x==cur_x)
								{
								var kj=c;
								while(c<tmm2 )
									if(m[c+1].type==1 && m[c+1].x==cur_x) c++;
									else break;
								if(c>kj) {a=m[c];}
								}								
*/							
							if(a.y>cur_y) PathOrient[CurveAddlevel]=2;
							else if(a.y<cur_y) PathOrient[CurveAddlevel]=1;
								else 
									PathOrient[CurveAddlevel]=0;
							if(CurveAddlevel>subPath)
								{
								if(PathOrient[CurveAddlevel-1]==0) // this the case of start by horizontal line
									{
									//if(PathOrient[CurveAddlevel])
									PathOrient[CurveAddlevel-1]=PathOrient[CurveAddlevel];
									CurveAddlevel--;
									}
								else
									{
									if(PathOrient[CurveAddlevel]==0)
										CurveAddlevel--;
									else	
										if(PathOrient[CurveAddlevel]==PathOrient[CurveAddlevel-1] && m[c-1].type>0)
											CurveAddlevel--;
									}
								}
							MakeLine(cur_x, cur_y, a.x, a.y);
							cur_x=a.x;cur_y=a.y;
							
							DrawingLevel++;
							CurveAddlevel++;

							break;
							
						case 0:
							subPath=CurveAddlevel;
							save_x=cur_x=a.x;save_y=cur_y=a.y;
							if(c>3)
								{
								var fls=FillSection.length;
								FillSection[fls]= new Array();
								FillSection[fls].st=flagBeg;
								FillSection[fls].ed=StokeMouseEvent.length;
//								OutlineDraw(ItemArray[x].strokeType,ItemArray[x].fillType,flagBeg,(Disflag&1));
//								Disflag=2;
								//flagBeg=Ppoints.length;
//								//flagBeg=NewPpoints.length;
								DrawingLevel++;
								CurveAddlevel++;
								flagBeg=StokeMouseEvent.length ;
								continue;
								}
							break;								
							
						case 2:
							if(cur_x==a.x && cur_y==a.y) continue;
							PathOrient[CurveAddlevel]=0;
							MakeCurve(cur_x,cur_y,a.x1,a.y1,a.x2,a.y2,a.x,a.y);
							cur_x=a.x;cur_y=a.y;
							DrawingLevel++;
							CurveAddlevel++;
							break;
						}
					}
				if(m.length>2 && ItemArray[x].closed)
						{
						MakeLine(cur_x, cur_y, save_x, save_y);
						if(save_y>cur_y) PathOrient[CurveAddlevel]=2;
							else if(save_y<cur_y) PathOrient[CurveAddlevel]=1;
								else PathOrient[CurveAddlevel]=0;
						DrawingLevel++;
						CurveAddlevel++;
						}
				break;
			default:return;
			}
		CurveAddlevel++;
		if(CurveAddlevel>1000)
			CurveAddlevel=CurveAddlevel;
		var fls=FillSection.length;
		FillSection[fls]= new Array();
		FillSection[fls].st=flagBeg;
		FillSection[fls].ed=StokeMouseEvent.length;
		OutlineDraw(ItemArray[x].strokeType,ItemArray[x].fillType,flagBeg,Disflag);
		}


var ItemCount=0;
var SvgEditItem=0;
function RenderingAll()
		{
		CurrentItem=ItemCount;
		ItemCount++;
		SvgEditItem++;
		SetUpNewItem2(CurrentItem);
		RefreshItem(CurrentItem);
		if(SvgEditItem>=ItemIds.length)
			{
			CurrentItem=ItemCount;
			ItemArray[CurrentItem]=new _elementPath();
			

			ItemCount++;
			SetUpNewItem2(CurrentItem);
			ShowGlobe();
  
			ItemCount=0;
		
			}
		else
			{
			document.getElementById("StatusDiv").innerHTML="Generating SVG image ..."+(SvgEditItem+1)+" of "+ ItemIds.length;
				{
				var mystring="RenderingAll();";
				setTimeout(mystring,1);
				}
			}
		}
		
function SetUpNewItem2(cur)
		{
		var y = document.getElementById("PAPA").appendChild(document.createElement('div'));
		y.id = 'item'+ cur;	y.className='Items';y.style.top="10px";y.style.left="10px";
		y.style["zIndex"]=cur+100;
		y.style.top=ItemArray[cur].translateY+"px";
		y.style.left=ItemArray[cur].translateX+"px";
		var yy = y.appendChild(document.createElement('div'));
		yy.id = 'itemDR'+ cur;	yy.className='Items'; yy.style.top="0px";
		yy.style.left="0px"; 
		}
		
	
		


function RgbToString(RR,GG,BB)
		{
		var x = "#" + IntToHex(RR) + IntToHex(GG) + IntToHex(BB);
		return(x);
		}
		
function AlphaRgbToString(OO,RR,GG,BB)
		{
		var x = "#" +IntToHex(OO)+ IntToHex(RR) + IntToHex(GG) + IntToHex(BB);
		return(x);
		}		
function IntToHex(n) {n &=0xff; var result = n.toString(16);if (result.length==1) result = "0"+result;return result;}


var SVGList=new Array();
var SvgTopList=-1;
//document.getElementById("img"+x+"_"+CurrentItem).src
//return(XMB[c][y]);
function isMeat(a)
		{
		var c=HBitmapSize[a];
		var t= Ypos-c.t;
		var l=(Xpos-c.l)>>1;
		var w= c.w>>1;
		
		if(ie5)
			{
			w= (c.w+7) >>3;
			l=Xpos-c.l;
			w<<=3;
			t*=w;
			t+=l;
			l=t>>3;
			l*=5;
			w=XMB[a][8];
			c=w.indexOf("{")+4;
			c+=l;
			l=w.substring(c,c+2);
			l=parseInt(l,16);
			if(isNaN(l)) return(0);
			if(l!=255) return(1);
			return(0);
			}
		w++;
		var kk=w*t;
		w=kk;
		w+=l;
		if(w>65519)
			{
			w+=(Math.floor(w/65520)*17);
			}
		w+=136;
		if(HBitmap[a].charCodeAt(w)>0)
			return(1);
		return(0);
		}


	
function PapaMouseMove(e)
	{
  	Xpos=
		(ie5)?event.x+window.document.body.scrollLeft:(ns6)?clientX=e.clientX+window.pageXOffset:e.pageX;
	Ypos=
		(ie5)?event.y+window.document.body.scrollTop:(ns6)?clientY=e.clientY+window.pageYOffset:e.pageY;
	if(ie5)
		{
		try{
			var a=document.getElementById(event.srcElement.id).style;
			Xpos=parseInt(a.left)+event.offsetX;
			Ypos=parseInt(a.top)+event.offsetY;
			} catch(e){;}
		}
	
	var a;
	
	if(SvgTopList>=0)
		{
		if(isMeat(SvgTopList)) 
			{
			a=document.getElementById("ItemName").style;
			a.top=(Ypos+1)+"px";
			a.left=(Xpos+1)+"px";
			return;
			}
		}
	//for(a=0;a<CurrentItem;a++)
	for(a=CurrentItem-1;a>=0;a--)
		{
		var c=HBitmapSize[a];
		if(Ypos<c.t) continue;
		if(Xpos<c.l) continue;
		
		if(Ypos>(c.t+c.h)) continue;
		if(Xpos>(c.l+c.w)) continue;
		if(isMeat(a))
			{
			if(SvgTopList!=a)
				{
				if(SvgTopList>=0)ChangeBackGround(SvgTopList);
				document.getElementById("ItemName").innerHTML=ItemIds[a];
				ChangeBackGround(a);
				}
			SvgTopList=a;
			a=document.getElementById("ItemName").style;
			a.top=(Ypos+1)+"px";
			a.left=(Xpos+1)+"px";
			return;
			}
		}
	if(SvgTopList>=0)
		if(HiLightColor[2]==1) ChangeBackGround(SvgTopList);
	document.getElementById("ItemName").innerHTML="";
	SvgTopList=-1;
	}