var elemId;
var maxR;
var maxL;
var maxT;
var maxB;

//////////////////////////////////////////////////////////////////////////////////////////////////////////////
//get element position
function findPos(obj) {
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		curleft = obj.offsetLeft;
		curtop = obj.offsetTop;
		while (obj = obj.offsetParent) {
			curleft += obj.offsetLeft;
			curtop += obj.offsetTop;
		}
	}
	return [curleft,curtop];
}
//end get element position
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////


////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//start mouse wheel
/** This is high-level function; REPLACE IT WITH YOUR CODE.
 * It must react to delta being more/less than zero.
 */

//continue mouse wheel
function wheel(event){
	var delta = 0;
	if (!event) {event = window.event;}
	if (event.wheelDelta) {
		delta = event.wheelDelta/120; 
		if (window.opera) delta = -delta;
	} else if (event.detail) {
		delta = -event.detail/3;
	}
	if (delta)
		if (event.preventDefault)
             event.preventDefault();
        event.returnValue = false;
  return delta;
}
//continue mouse wheel
/* Initialization code. */
if (window.addEventListener) 
		window.addEventListener('DOMMouseScroll', imgZoom, false);
	window.onmousewheel = document.onmousewheel = imgZoom;
// end dealing with mouse wheel
/////////////////////////////////////////////////////////////////////////////////



//////////////////////////////////////////////////////////////////////////////////////////////////////////////
var e = 0;
document.onmousedown = grabImg;
document.onmouseup = releaseImg;
document.onmousemove = followMouse;	
var grab =0;

//panDiv = document.getElementById('imgPanDiv');
function followMouse(e) {
	e 		  = e || window.event; //event is passed into the function by FireFox 
	xMousePos = e.pageX ? e.pageX : e.x
	yMousePos = e.pageY ? e.pageY : e.y
	//targ = e.target ? e.target : e.srcElement
	//elemId = eval("document.getElementById('"+targ.id+"')");
	
	if (grab == true && targ.id == 'dragMe') {
		newGrabX = (xMousePos - xDif);
		newGrabY = (yMousePos - yDif);
		elemId.style.top = newGrabY+"px";
		elemId.style.left = newGrabX+"px";
		//document.getElementById('whatsUp').innerHTML = "targ.id "+targ.id;
	} 
	
	
	
	if ((xMousePos > maxR || xMousePos < maxL || yMousePos < maxT || yMousePos > maxB)&& (targ.id == 'imgBorder' || targ.id == 'theImg')){
		grab = 0;
		return false;
	} 
	
	if (grab == true && (targ.id == 'imgBorder' || targ.id == 'theImg') && !(xMousePos > maxR || xMousePos < maxL || yMousePos < maxT || yMousePos > maxB)) {
		newImgX = (xMousePos - xDif);
		newImgY = (yMousePos - yDif);
			

		if ((newImgY <= maxT) && (newImgY+currentHeight) >= maxB){
			document.getElementById('theImg').style.top = newImgY+"px";
		}
		if ((newImgX <= maxL) && (newImgX+currentWidth) >= maxR) {
			document.getElementById('theImg').style.left = newImgX+"px";
		}
	}
	//return (xMousePos, yMousePos);
	return false;
}
var targ=document;

function grabImg(e){	
	if (!e) {var e = window.event;}
	//var targ;
	targ = e.target ? e.target : e.srcElement
	elemId = eval("document.getElementById('"+targ.id+"')");
	document.getElementById('whatsUp').innerHTML = targ.id;
	if (targ.id == 'imgBorder') {
		grab = true;
		imgLeft = parseInt(document.getElementById('theImg').style.left);
		imgTop = parseInt(document.getElementById('theImg').style.top);
		xDif = (xMousePos - imgLeft);
		yDif = (yMousePos - imgTop);
		
	}
	if (targ.id == 'dragMe' || targ.id == 'theImg'){
		grab = true;
		imgLeft = parseInt(elemId.style.left);
		imgTop = parseInt(elemId.style.top);
		xDif = (xMousePos - imgLeft);
		yDif = (yMousePos - imgTop);
	}
	
/*	
	if (targ.id == 'imgBorder' || targ.id == 'dragMe'){
		grab = true;
		imgLeft = parseInt(elemId.style.left);
		imgTop = parseInt(elemId.style.top);
		xDif = (xMousePos - imgLeft);
		yDif = (yMousePos - imgTop);
	}
*/
	//return(xDif,yDif);
	return false;
}

function releaseImg() {//this will have to set the image where ever it is
	grab = 0;
	//alert('i am in release');
	return false;
}

/////////////////////////////////////////////////////////////////////////////////////////////////////////////




/////////////////////////////////////////////////////////////////////////////////////////////////////////
//set division according to end of image
function setBottomDiv() {
	myImg = document.getElementById('theImg');
	imgLoc = findPos(myImg);
	imgHeight = document.imgName.height;
	newLoc = (imgLoc[1]+imgHeight);
	document.getElementById('bottomDiv').style.top = newLoc+"px";
	document.getElementById('leftDiv').style.height = newLoc+"px";//make sure these extend all the way down to the bottomDiv
	document.getElementById('rightDiv').style.height = newLoc+"px";//beyond the end to the page (there's a scroll gap)
	
}
// end locating bottom division
////////////////////////////////////////////////////////////////////////////////////////////////////////////

function optMenu() {
	optText = document.getElementById('options');
	optList = document.getElementById('optDiv');
	if (optList.style.display == 'none') {
		optText.innerHTML = 'Options < '; 
		optList.style.display = 'block';
	} else {
		optText.innerHTML = 'Options > '; 
		optList.style.display = 'none';	
	}

}