// Global holds reference to selected element
var selectedObj;
// Globals hold location of click relative to element
var offsetX, offsetY;
var clientX, clientY;
var nMixRow = -1;
var nSelectLimit = 10;

// Set global reference to element being engaged and dragged
function setSelectedElem(evt) {
    var target = (evt.target) ? evt.target : evt.srcElement;
    var divID = (target.name && target.src) ? target.name + "Wrap" : "";
    if (divID) {
        if (document.layers) {
            selectedObj = document.layers[divID];
        } else if (document.all) {
            selectedObj = document.all(divID);
        } else if (document.getElementById) {
            selectedObj = document.getElementById(divID);
        }
        setZIndex(selectedObj, 100);
        return;
    }
    selectedObj = null;
    return;
}

// Drag an element
function dragIt(evt) {
    evt = (evt) ? evt : event;
    if (selectedObj) {
       	clientX = evt.clientX;
		clientY = evt.clientY;
			
        shiftTo(selectedObj, (evt.clientX - offsetX), (evt.clientY - offsetY));

        evt.cancelBubble = true;
        return false;
    }
}

function engage(evt) {
    evt = (evt) ? evt : event;
    setSelectedElem(evt);
    if (selectedObj) {
        if (evt.pageX) {
 			offsetX = evt.clientX ;
            offsetY = evt.clientY ;
			
        } else if (evt.offsetX || evt.offsetY) {
            offsetX = evt.clientX ;
            offsetY = evt.clientY ;
        } else if (evt.clientX) {
            offsetX = evt.clientX - ((selectedObj.offsetLeft) ?
                      selectedObj.offsetLeft : 0);
            offsetY = evt.clientY - ((selectedObj.offsetTop) ?
                      selectedObj.offsetTop : 0);        
        }
        return false;
    }
}

// Turn selected element off
function release(evt) {
    if (selectedObj) {
		getTargetElem();
        selectedObj = null;
    }
}

function getTargetElem() {
	var srcImageID = new String(selectedObj.id);
	var bLocated = false;

	srcImageID = srcImageID.replace(/Wrap\b/, "");
	
	if (TileInUse(srcImageID)){return;}

	var objTemp = getRawObject(srcImageID);
	var IMGWidth = objTemp.width;
	var IMGHeight = objTemp.height;
	var IMGSRC = objTemp.src;
	var IMGAlt = objTemp.alt;
	var BaseY = getOffsetTop(getRawObject("tblContainer")) + 3;
	var BaseX = getOffsetLeft(getRawObject("tblContainer")) + 3;
	var minX;
	
	for (var imgs = 0; imgs < nSelectLimit; imgs++)
	{
		objTemp = getRawObject("tdColor" + (imgs+1));
		minX = BaseX + objTemp.offsetParent.offsetParent.offsetLeft - 4;
		minY = BaseY + objTemp.offsetTop - 4;
		maxY = minY + IMGHeight + 8;
		maxX = minX + (IMGWidth*2);
		
		if (srcImageID=="imgSrcmixed"){clearRow((imgs+1));}

		if(clientX >= minX && clientX <= maxX && clientY >= minY && clientY <= maxY)
		{
			//if the mix row is in effect, they can only replace that image, otherwise they can replace any image
			if((nMixRow==(imgs+1) && nMixRow>-1)||(nMixRow!=(imgs+1) && nMixRow==-1))
			{
				//1
				objTemp = getRawObject("imgColor" + (imgs+1));
				objTemp.src = IMGSRC;
				objTemp.alt = IMGAlt;
				objTemp.title = IMGAlt;
				
				//2
				if (srcImageID=="imgSrcmixed"){objTemp = getRawObject("txtColor" + (imgs+1));objTemp.value='100';nMixRow=(imgs+1);}else{nMixRow=-1}
				
				objTemp = getRawObject(srcImageID + "Wrap")
				if(objTemp != null) objTemp.style.display = "none";
				
				//3
				objTemp = getRawObject("hidColor" + (imgs+1));
				
				if (objTemp.value !=""){	
					var sSKUName = new String(objTemp.value);
					var aSKUName = sSKUName.split(":");
					var objHidden = getRawObject("imgSrc" + aSKUName[0].replace(/ /g,'_') + "Wrap");
					if(objHidden != null){
						shiftTo(objHidden, 0, 0);
						objHidden.style.display = "block";
						objHidden = null;
					}
					objTemp.value = IMGAlt;
				}
				else{
					objTemp.value = IMGAlt;
				}

				bLocated = true;
				document.getElementById("DelIcon" + (imgs+1)).style.display = "block";
						
				selectedObj = null;
				objTemp = null;
						
				clientX=0;
				clientY=0;
			}
		}
	}
	if(!bLocated){
		shiftTo(selectedObj, 0, 0);
		selectedObj = null;
		clientX=0;
		clientY=0;
		if(nMixRow>-1){
			alert('You must clear the \'mixed bag\' selection before selecting individual colors.');
		}
	}
    return;
}

// Set event capture for Navigator 4
function setNSEventCapture() {
    document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP);
}

// Assign event handlers used by both Navigator and IE
function localInit() {
    if (document.layers) {
        setNSEventCapture();
    }
    document.onmousedown = engage;
    document.onmousemove = dragIt;
    document.onmouseup = release;
    
}