// 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 parentOffsetX, parentOffsetY;

// 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);
        showWidthNotes(false);
        return;
    }
    selectedObj = null;
    showWidthNotes(false);
    return;
}

// Drag an element
function dragIt(evt) {
    evt = (evt) ? evt : event;
    if (selectedObj) {
        if (evt.pageX) {
			clientX = evt.clientX;
			clientY = evt.clientY;
			
            shiftTo(selectedObj, (evt.clientX - offsetX), (evt.clientY - offsetY));
        } else if (evt.clientX || evt.clientY) {
            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/, "");
	
	//ns debug section
	var objParent = getRawObject("topTable");
	var objTemp = getRawObject(srcImageID);
	var IMGWidth = objTemp.width;
	var IMGHeight = objTemp.height;
	var IMGSRC = objTemp.src;
	var IMGAlt = objTemp.alt;
	var minX, minY, maxX, maxY;
	
	objTemp = getRawObject("lblColor1");
	lblColorOffsetWidth = objTemp.offsetWidth;
	
	for (var imgs = 1; imgs < maxColors+1; imgs++){
		objTemp = getRawObject("tdColor" + imgs);
		minX = lblColorOffsetWidth + parentOffsetX + objParent.offsetLeft;
		minY = parentOffsetY + objTemp.offsetTop;
		maxY = minY + IMGHeight + 6;
		maxX = minX + (IMGWidth *2);
				
		if(clientX >= minX && clientX <= maxX && clientY >= minY && clientY <= maxY){
			
			objTemp = getRawObject("hidColor" + imgs);
			if(objTemp.value != '')
				moveDown(imgs);
				
			//1
			objTemp = getRawObject("imgColor" + imgs);
			objTemp.src = IMGSRC;
			objTemp.alt = IMGAlt;
			objTemp.title = IMGAlt;
				
			//2
			objTemp = getRawObject(srcImageID + "Wrap")
			shiftTo(objTemp, 0, 0);
				
			//3
			objTemp = getRawObject("hidColor" + imgs);
			objTemp.value = IMGAlt;

			bLocated = true;
			clientX=0;
			clientY=0;
		}
	}
	if(!bLocated){
		shiftTo(selectedObj, 0, 0);
		selectedObj = null;
		clientX=0;
		clientY=0;
	}else{hideContinue();}
	objTemp = null;
    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;
}

function moveDown(startIndex){
	var nOpenSlot = maxColors;
	var objTile, objDummy;
	var sSKUName;
	var aSKUName;
	
	//Look for an empty slot
	for (var imgs = startIndex; imgs < maxColors+1; imgs++){
		objTile = getRawObject("hidColor" + imgs);
		
		if (objTile.value ==""){	
			nOpenSlot=imgs;
			break;
		}
	}
		
	for(imgs = nOpenSlot; imgs > startIndex; imgs--){
		objTile = getRawObject("imgColor" + (imgs-1));
		objDummy = getRawObject("imgColor" + imgs);
		
		objDummy.src = objTile.src;
		objDummy.alt = objTile.alt;
		objDummy.title = objTile.title;
				

		objTile = getRawObject("hidColor" + (imgs-1));
		objDummy = getRawObject("hidColor" + imgs);
		objDummy.value = objTile.value;
	}
	
	return;
}