var mouseX = 0;

var mouseY = 0;

// new Image().src = '../cgi/edit-admin/img/loading.gif';



if (document.all) {

	document.onmousemove = iMouse;

}

else if ( document.implementation) {

	window.captureEvents(Event.MOUSEMOVE);

	window.onmousemove = nMouse;

}

function iMouse() {

	var scrolX = (document.compatMode == "CSS1Compat")?

				document.documentElement.scrollLeft: document.body.scrollLeft;;

	var scrolY = (document.compatMode == "CSS1Compat")?

				document.documentElement.scrollTop: document.body.scrollTop;;

	mouseX = event.x + scrolX;

	mouseY = event.y + scrolY;

}

function nMouse(e) {

	mouseX = e.pageX;

	mouseY = e.pageY;

}



function popupImage(filepath){

	if (popupImage.frameNode) closeImage();

	popupImage.frameNode = document.createElement('span');

	

    if (document.all) {

		popupImage.scrolX = (document.compatMode == "CSS1Compat")?

				document.documentElement.scrollLeft: document.body.scrollLeft;;

		popupImage.scrolY = (document.compatMode == "CSS1Compat")?

				document.documentElement.scrollTop: document.body.scrollTop;;

		popupImage.browsW = (document.compatMode == "CSS1Compat")?

				document.documentElement.clientWidth : document.body.clientWidth;

		popupImage.browsH = (document.compatMode == "CSS1Compat")?

				document.documentElement.clientHeight : document.body.clientHeight;

		popupImage.x = mouseX;

		popupImage.y = mouseY;

		popupImage.frameNode.onclick = closeImage;

    } else if( document.implementation) {

		popupImage.scrolX = window.pageXOffset;

		popupImage.scrolY = window.pageYOffset;

		popupImage.browsW = innerWidth;

		popupImage.browsH = innerHeight;

		popupImage.x = mouseX;

		popupImage.y = mouseY;

		popupImage.frameNode.addEventListener('click' ,closeImage , true);

    } else {

        return false;

    }



	popupImage.frameNode.style.position = 'absolute';

	popupImage.frameNode.style.left = (popupImage.x-42) + 'px';

	popupImage.frameNode.style.top = (popupImage.y-10) + 'px';

		popupImage.frameNode.style.borderColor = '#555555';

		popupImage.frameNode.style.borderWidth = '1px';

		popupImage.frameNode.style.borderStyle = 'solid';

		popupImage.frameNode.style.backgroundColor = '#f4f4f4';

		popupImage.frameNode.style.padding = '15px';

	popupImage.frameNode.style.margin = '0px';

	

	// Now Loading...

	popupImage.frameNode.innerHTML = '<b style="color:#666">Now Loading...</b>'; 

	

	document.body.appendChild(popupImage.frameNode);

	

	popupImage.real = new Image();

	popupImage.real.onload = loadImage;

	popupImage.real.src = filepath;



    function loadImage() {

		closeImage();

		popupImage.frameNode = document.createElement('span');

		popupImage.imgNode = document.createElement('img');

		popupImage.imgNode.setAttribute('src', popupImage.real.src);

		if (document.all) {

			popupImage.frameNode.onclick = closeImage;

			popupImage.frameNode.onmouseout = mouseOut;

			popupImage.frameNode.onmouseover = mouseOver;

		} else if( document.implementation) {

			popupImage.frameNode.addEventListener('click' ,closeImage , true);

			popupImage.frameNode.addEventListener('mouseover' ,mouseOver , true);

			popupImage.frameNode.addEventListener('mouseout' ,mouseOut , true);

		} else {

		    return false;

		}



		var x = (popupImage.x-popupImage.real.width/2);

		var y = (popupImage.y-popupImage.real.height/2);

		var mx = x - popupImage.scrolX;

		var my = y - popupImage.scrolY;

		if (mx+popupImage.real.width+32 > popupImage.browsW) x = popupImage.scrolX + popupImage.browsW-popupImage.real.width-32;

		if (my+popupImage.real.height+32 > popupImage.browsH) y = popupImage.scrolY + popupImage.browsH-popupImage.real.height-32;

		if (mx < 32) x = popupImage.scrolX + 32;

		if (my < 32) y = popupImage.scrolY + 32;



		popupImage.frameNode.style.position = 'absolute';

		popupImage.frameNode.style.left = x + 'px';

		popupImage.frameNode.style.top = y + 'px';

			popupImage.frameNode.style.borderColor = '#555555';

			popupImage.frameNode.style.borderWidth = '1px';

			popupImage.frameNode.style.borderStyle = 'solid';

			popupImage.frameNode.style.paddingTop = '15px';

			popupImage.frameNode.style.paddingBottom = '15px';

			popupImage.frameNode.style.backgroundColor = '#ffffff';

		popupImage.frameNode.style.margin = '0px';

		popupImage.frameNode.appendChild(popupImage.imgNode);

		

			popupImage.closeMark1 = document.createElement('span');

			popupImage.closeMark1.setAttribute('id', 'test');

			popupImage.closeMark1.innerHTML = '~';

			popupImage.closeMark1.style.color = "#cccccc";

			popupImage.closeMark1.style.position = 'absolute';

			popupImage.closeMark1.style.left = (popupImage.real.width-16)+'px';

			popupImage.closeMark1.style.top = '0px';

			popupImage.closeMark1.style.padding = '2px';

			popupImage.frameNode.appendChild(popupImage.closeMark1);

		

		document.body.appendChild(popupImage.frameNode);

	}

	

    function mouseOver(){

        if (popupImage.frameNode) {

            popupImage.frameNode.style.cursor = "pointer";

			popupImage.closeMark1.style.color = "#000000";

        }

    }

    function mouseOut(){

        if (popupImage.frameNode) {

            popupImage.frameNode.style.cursor = "auto";

			popupImage.closeMark1.style.color = "#cccccc";

        }

    }

    function closeImage(){

        if (popupImage.frameNode) {

            document.body.removeChild(popupImage.frameNode);

            popupImage.frameNode = null;

            document.body.onclick = "";

        }

    }

}


