// Copyright 2004-2006  Mark Chackerian and picturedots.com
// All rights reserved.

// Global variables
xMousePos = 0;
yMousePos = 0;
xMousePosMax = 0; // Width of the page
yMousePosMax = 0; // Height of the page
dotNum=1;
lineNum=1;

var dotsArrX =new Array();
var dotsArrY =new Array();
var linesArrX=new Array();
var linesArrY=new Array();
var divsArr  =new Array();
var dImg;
var dotsBgColor = "";
var dotsBgColorHighlight="#DBE9FF";
var mUp=0;
var yOff=4;
var hcolor="#bbaaaa";
var dirtyPreview = new Boolean(false);
var dotId;
var previewAtInit = -1;
var scaler=0;
var dot_list;
var line_list;

// event handler in draw mode
function clickDot() {
    drawDot(xMousePos,yMousePos);
}

// create d
function drawDot(x,y) {
    if ( checkBoundary(x,y) ) {
	var ddiv = document.createElement("DIV");
	ddiv.className="dots";
	ddiv.style.left = x + "px";
	ddiv.style.top = y-yOff + "px";
	ddiv.style.backgroundColor = dotsBgColor;
	ddiv.style.zIndex=10+dotNum;
	ddiv.style.position = "absolute";
	ddiv.innerHTML = '&#149; <span class="numbers">' + dotNum + "</span>";
	if (displayNum) {
	    ddiv.innerHTML = '&#149; ' + dotNum ;
	} else {
	    ddiv.innerHTML = '&#149; ';
	}
	document.body.appendChild(ddiv);
	dotsArrX[dotNum]=x;   
	dotsArrY[dotNum]=y;   
	divsArr[dotNum]=ddiv;
   //   if (dotNum > 1) { drawSegment(x,y,dotsArrX[dotNum - 1],dotsArrY[dotNum - 1]); }
	dotNum++;
	dirtyPreview = true;
//	dDbg.innerHTML = x + " " + y + " yOff:" + yOff;
    }
}

// decide whether to take action or not
function checkBoundary(x,y) {
    var liCount = document.getElementsByTagName('li');
    var inSelect = new Boolean(false);

    // check if select boxes open
    var ulList = document.getElementsByTagName("ul");
    for (var i=0;i<ulList.length;i++) {
      if (ulList[i].className == "selectReplacement selectOpen") {
	inSelect = true;
      }
    }
    return ( (y > 41) && (yMousePosMax > y + 15) && (xMousePosMax > x + 20) && (dInst.style.visibility=='hidden') && (dCncl.style.visibility=='hidden') && (inSelect== false ) );
}

function backup() {
 if (dotNum>1) {
  dotsArrX.length = dotsArrY.length - 1;
  dotsArrY.length = dotsArrY.length - 1;
//  dotsArrY[dotNum] = "0";
  dotNum--;
  document.body.removeChild(divsArr[dotNum]);
  clearPreview();
  }
}

function dClear() {
    while (dotNum>1) { backup(); }
    clearPreview();
    clearLineArt();
    clearImage();
}

function clearPreview() {
    dLncn.innerHTML="";
}

function previewVisible() {
    return (dLncn.innerHTML.length > 1);
}

function clearLineArt() {
    dDrcn.innerHTML="";
    dirtyPreview = false;
}

function clearImage() {
  if (dImg) { document.body.removeChild(dImg) };
  setDotsBgColor("");
}

function captureMousePosition(e) {
    if (document.all) {
        xMousePos = window.event.x+document.body.scrollLeft;
        yMousePos = window.event.y+document.body.scrollTop;
	if (document.documentElement && document.documentElement.clientHeight) { // Explorer strict
	    xMousePosMax = document.documentElement.clientWidth  + document.body.scrollLeft;
	    yMousePosMax = document.documentElement.clientHeight + document.body.scrollTop;
	} else {
	    xMousePosMax = document.body.clientWidth+document.body.scrollLeft;
	    yMousePosMax = document.body.clientHeight+document.body.scrollTop;
	    //mode = "document.all";
	}
    } else if (document.getElementById) {
        xMousePos = e.pageX;
        yMousePos = e.pageY;
        xMousePosMax = window.innerWidth+window.pageXOffset;
        yMousePosMax = window.innerHeight+window.pageYOffset;
    }
    window.status = "xMousePos=" + xMousePos + ", yMousePos=" + yMousePos + ", xMousePosMax=" + xMousePosMax + ", yMousePosMax=" + yMousePosMax + " mode:" + mode.get();
}

function loadImage(stuff) {
    if (stuff) {
	if (dImg) { 
	    try { document.body.removeChild(dImg); }
	    catch (e) {}
	}
	dImg = document.createElement("DIV");
	dImg.className="bImg";
	dImg.innerHTML = "<img src=" + stuff + " style='padding-top: 10px; height: " + yMousePosMax *.9 + "px' />";
	//  dImg.style.backgroundImage = "url(" + stuff + ")";
	//  dImg.style.background = "url(" + stuff + ") no-repeat";

	document.body.appendChild(dImg);
	setDotsBgColor(dotsBgColorHighlight);
	dImg.style.zIndex="2";
	//  dHide.style.color=dShow.style.color="";
	setVal("imageView",0);
    }
}

function hideImg(obj) {
  if (!obj) return;
  obj.style.visibility="hidden";  
  setDotsBgColor("");
//  dDbg.innerHTML = dImg.style.visibility  + " hi";
//  dHide.style.backgroundColor=hcolor;
//  dShow.style.backgroundColor="";

}

function showImg(obj) {
  if (!obj) return;
  obj.style.visibility="visible" ;
  setDotsBgColor(dotsBgColorHighlight);
//  dHide.style.backgroundColor="";
//  dShow.style.backgroundColor=hcolor;

}

function showLines(obj) {
  if (!obj) return;
  obj.style.visibility="visible";
}

function hideLines(obj) {
  if (!obj) return;
  obj.style.visibility="hidden";
}


function setDotsBgColor(color) {
  for (i=1; i< dotNum ; i++) {
    divsArr[i].style.backgroundColor=color;
  }
  dotsBgColor=color;
}

function genStrSave() {
 var strSavePath="?d=";
 for (i=1; i< dotNum ; i++) {
  strSavePath +=  dotsArrX[i] + "," + dotsArrY[i] + "|";
 }
 strSavePath +="&l=";
 for (i=1; i< lineNum; i++) {
  strSavePath +=  linesArrX[i] + "," + linesArrY[i] + "|";
 }
 return strSavePath;
}

function makeLink() {
 var strSave = location.pathname + genStrSave();
 location=strSave;
}

/*
function showLines() {
 var strSave = "previewDots.html" +  genStrSave();
 window.open(strSave);
} */

function print() {
 var strSave = "/view/printDots.php" +  genStrSave() + "&type=pdf";
 window.open(strSave);
}

function savePHP() {
 var strSave = "/make/submitDots.php" + genStrSave();
 location=strSave;
}

function mvInit() {
 mUp=0;
 regex = /(\d+)/;
 result = regex.exec(this.innerHTML);
 cDot=result[1];
// alert("in mvInit with " + cDot);
 moveDots();
}

function moveDots() {
 if (mUp==0) {
  divsArr[cDot].style.top= (yMousePos-yOff) + "px";
  divsArr[cDot].style.left= xMousePos +  "px";
  setTimeout(moveDots,50);
  clearPreview();
 } else {
   dotsArrX[cDot]=xMousePos;   
   dotsArrY[cDot]=(yMousePos-yOff);
 }
}

function release(){
 mUp=1;
}

/*
function moveMode() {
 document.onmouseup = release;
 for (i=1; i< dotNum ; i++) {
   divsArr[i].onmousedown=mvInit;
   divsArr[i].style.cursor="default";
 }
 dDmde.style.backgroundColor="";
 dMmde.style.backgroundColor=hcolor;
}

function drawMode() {
 document.onmouseup = clickDot;
 for (i=1; i< dotNum ; i++) {
   divsArr[i].onmousemove=null;
   divsArr[i].onmousedown=null;
   divsArr[i].onmouseup=null;
   divsArr[i].style.cursor=null;
 }
 dMmde.style.backgroundColor="";
 dDmde.style.backgroundColor=hcolor;
}
*/
function Mode() {
    var mode;
}

Mode.prototype.set = function (m) {

  this.mode = m;
  if (this.mode == "drawDots") {
      document.onmouseup = clickDot;
      for (i=1; i< dotNum ; i++) {
	  divsArr[i].onmousemove=null;
	  divsArr[i].onmousedown=null;
	  
	  divsArr[i].onmouseup=null;
	  divsArr[i].style.cursor="crosshair";
      }
//      dMmde.style.backgroundColor="";
//      dDmde.style.backgroundColor=hcolor;
  } else if (this.mode == "moveDots") {
      document.onmouseup = release;
      for (i=1; i< dotNum ; i++) {
	  divsArr[i].onmousedown=mvInit;
	  divsArr[i].style.cursor="default";
      }
//      dDmde.style.backgroundColor="";
//      dMmde.style.backgroundColor=hcolor;
  } else if (this.mode == "drawLines") {
      document.onmousedown = startDrawLine;
      document.onmouseup = endDrawLine;
  }  
}

Mode.prototype.get = function () {
//  alert (this.mode);
  return this.mode;
}

var mode = new Mode();

function insertDot(p) {
 p = p-0;

 if ((p >= dotNum) || (p<1)) { return; }
 var newdotNum = dotNum + 1;
 var newX = Math.round( (dotsArrX[p] + dotsArrX[p-1])/2);
 var newY = Math.round( (dotsArrY[p] + dotsArrY[p-1])/2);
 if (p==1) {
  newX = dotsArrX[1];
  newY = dotsArrY[1];
 }
// insert into dotsArr's, divsArr and increment values
 for (i = dotNum ; i > p ; i--) {
  dotsArrX[i] = dotsArrX[i-1];
  dotsArrY[i] = dotsArrY[i-1];
  divsArr[i] = divsArr[i-1];
  divsArr[i].innerHTML = "&#149; " + i;
 }
 // create new div
 dotNum = p;
 drawDot(newX,newY);

 // move divs
 for (i = p ; i > newdotNum ; i++) {
  divsArr[i].style.left= dotsArrX +  "px";
  divsArr[i].style.top=  dotsArrY + "px";
 }

 dotNum = newdotNum;
}

function deleteDot(p) {
 p = p - 0;
 dDbg.innerHTML =  p;
 if ((p >= dotNum) || (p==0)) { return; }
 document.body.removeChild(divsArr[p]);
 // remap arrays
 dotNum--;
 for (i = p ; i < dotNum  ; i++) {
//  alert(i + "i p" + p);

  dotsArrX[i] = dotsArrX[i+1];
  dotsArrY[i] = dotsArrY[i+1];
//  alert(divsArr[i]);
  divsArr[i] = divsArr[i+1];
  divsArr[i].innerHTML = "&#149; " + i;
 }
 clearPreview();
}

function dataWindow(str1,str2,f) {
  dGtDt=document.createElement("getData");
  dGtDt.className="getData";
  document.body.appendChild(dGtDt);
  document.onmouseup = release;
  dGtDt.innerHTML = '<div style="margin: 20px; background: white;"><form name="frmData" onsubmit="return(false);">&nbsp;' + str1 + '<input type="text" size=5 name="data">&nbsp;<input type=button onclick="' + f + '(this.form.data.value);killData();" value="' + str2 + '" class="btn">&nbsp;<input type=button onclick="killData();" value="cancel" class="btn"></form></div>';


}

function killData() {
 document.body.removeChild(dGtDt);
// alert( "mode get " . mode.get() );
 if (mode.get() == "drawDots") {
     document.onmouseup = clickDot;
 }
}

function init() {
    xMousePosMax = 1600-0;
    yMousePosMax = 1200-0;

    var regex=/12/; // test browser regex implementation
    regex.exec("123");
    var testRC=RegExp.rightContext;
    // read scaler  (s) -- comes from url or set by PHP
    if (scaler == 0) {
	scaler =1;
	regex = /[\?\&]s=([\d\.]*)\&*/;
	if ((result = regex.exec( unescape(window.location.search) )) != null) {
	    scaler = result[1] - 0;
	    if (scaler < .0001) {
		scaler = 1;
	    }
	}
    }

    // read line preview (p)
    //var previewAtInit;
    regex = /[\?\&]p=([\d])/;
    if ((result = regex.exec( unescape(window.location.search) )) != null) {
	previewAtInit = result[1];
    }

    // read dots from url or set by PHP
    var input;
    if ( dot_list != null ) {
	input = dot_list;
    } else {
	regex = /[\?\&]d=(.*)\&*/;
	if ((result = regex.exec( unescape(window.location.search) )) != null) {
	    input = result[1];
	}
    }
    if (input != "") {
	if (testRC) {
	    regex=/(\d+),(\d+)\|/;
	} else {
	    regex=/(\d+),(\d+)\|(.*)/g;
	}
	while ((result = regex.exec(input)) != null) {
	    if (testRC) {
		input=RegExp.rightContext;
	    } else {
		input=result[3];
	    }
	    drawDot(result[1]*scaler,result[2]*scaler);
	    regex.exec(input); // safari
	}
    }


    // read id
    regex = /[\?\&]i=([\d\.]*)\&*/;
    if ((result = regex.exec( unescape(window.location.search) )) != null) {
	dotId =  result[1] - 0;
    }
    // read lines from url or set by PHP
    var line_input;
    if ( line_list != null ) {
	line_input = line_list;
    } else {
	regex = /[\?\&]l=(.*)\&*/;
	if ((result = regex.exec( unescape(window.location.search) )) != null) {
	    line_input = result[1];
	}
    }
    if (line_input != "") {
	if (testRC) {
	    regex=/(\d+)\.(\d+),(\d+)\.(\d+)\|/;
	} else {
	    regex=/(\d+)\.(\d+),(\d+)\.(\d+)\|(.*)/g;
	}
	while ((result = regex.exec(line_input)) != null) {
	    if (testRC) {
		line_input=RegExp.rightContext;
	    } else {
		line_input=result[5];
	    }
	    drawLine(result[1]*scaler,result[3]*scaler,result[2]*scaler,result[4]*scaler);
	    regex.exec(line_input); // safari
	}
    }

    mode.set("drawDots");
    if (previewAtInit ==1) {
	showLines(dLncn);
    }
}