var vpop_open=false;

function replace(str, original, replacement) {
	var result;
	result = "";
	while(str.indexOf(original) != -1) {
	if (str.indexOf(original) > 0)
	result = result + str.substring(0, str.indexOf(original)) + replacement;
	else
	result = result + replacement;
	str = str.substring(str.indexOf(original) + original.length, str.length);
	}
	return result + str;
}

function close_vpop(){
	var element=document.getElementById("vpop");
	element.style.display = "none";
	vpop_open=false;
	//clear content
	var content=document.getElementById("vpop-content");
	content.innerHTML='';
}

max_images=9;
current_image=1;

function open_image(image_id){
	var image_id;
	if(image_id=='next'){
		image_id=(current_image<max_images)?current_image+1:1;
	}
	if(image_id=='prev'){
		image_id=(current_image>1)?current_image-1:max_images;
	}
	v_popup_content('<img src="uploaded_images/photo/'+image_id+'.jpg" />');
	document.getElementById('vimage'+current_image).style.textDecoration="none";
	current_image=image_id;
	document.getElementById('vimage'+current_image).style.textDecoration="underline";
}


function v_popup_content(pop_content){
		if (!vpop_open){
			v_popup(pop_content,'<b><a href="#" onclick="open_image(\'prev\'); return false">&lt;&lt;</a>&nbsp;&nbsp;<a href="#" onclick="open_image(1); return false" id="vimage1">1</a>&nbsp;&nbsp;<a id="vimage2" href="#" onclick="open_image(2); return false">2</a>&nbsp;&nbsp;<a href="#" id="vimage3" onclick="open_image(3); return false">3</a>&nbsp;&nbsp;<a id="vimage4" href="#" onclick="open_image(4); return false">4</a>&nbsp;&nbsp;<a href="#" id="vimage5" onclick="open_image(5); return false">5</a>&nbsp;&nbsp;<a href="#" id="vimage6" onclick="open_image(6); return false">6</a>&nbsp;&nbsp;<a href="#" id="vimage7" onclick="open_image(7); return false">7</a>&nbsp;&nbsp;<a href="#" id="vimage8" onclick="open_image(8); return false">8</a>&nbsp;&nbsp;<a href="#" id="vimage9" onclick="open_image(9); return false">9</a>&nbsp;&nbsp;<a href="#" onclick="open_image(\'next\'); return false">&gt;&gt;</a></b>',442,300);
		}
		else{
			pop_content=replace(pop_content, '&quot', '"');
			document.getElementById("vpop-content").innerHTML=pop_content;
		}
	}

function v_popup(pop_content,header_content,W,H,align){
	if (vpop_open)
		return false;	
	vpop_open=true;
	if(!header_content){
		header_content='&nbsp;';
	}
	else{
		header_content=replace(header_content, '&quot', '"');
	}
	document.getElementById("vpop-header").innerHTML=header_content;
	pop_content=replace(pop_content, '&quot', '"');
	document.getElementById("vpop-content").innerHTML=pop_content;
	//
	var browser=getBrowserSize();
	var scrolled=getScrollXY();
	var element=document.getElementById("vpop");
	//element.style.width='300px';
	element.style.left = (scrolled[0]+(browser[0] - W)/2)+"px";
	element.style.top = (scrolled[1]+(browser[1] - H)/2)+"px";
	element.style.display = "block";
}

/* GET POSITION */

function getBrowserSize() {
  var myWidth = 0, myHeight = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
    myWidth = window.innerWidth;
    myHeight = window.innerHeight;
  } else if( document.documentElement &&
      ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    //IE 6+ in 'standards compliant mode'
    myWidth = document.documentElement.clientWidth;
    myHeight = document.documentElement.clientHeight;
  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    //IE 4 compatible
    myWidth = document.body.clientWidth;
    myHeight = document.body.clientHeight;
  }
  return [ myWidth, myHeight ];
}

function getScrollXY() {
  var scrOfX = 0, scrOfY = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
    //Netscape compliant
    scrOfY = window.pageYOffset;
    scrOfX = window.pageXOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    //DOM compliant
    scrOfY = document.body.scrollTop;
    scrOfX = document.body.scrollLeft;
  } else if( document.documentElement &&
      ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    //IE6 standards compliant mode
    scrOfY = document.documentElement.scrollTop;
    scrOfX = document.documentElement.scrollLeft;
  }
  return [ scrOfX, scrOfY ];
}

/* DRAG */
N = (document.all) ? 0 : 1;
var ob;
var over = false;

function MD(e) {
	if (over){
		if (N) {
			ob = document.getElementById("vpop");
			X=e.layerX;
			Y=e.layerY;
			return false;
		}
		else {
			ob = document.getElementById("vpop");
			ob = ob.style;
			X=event.offsetX;
			Y=event.offsetY;
		}
	}
}

function MM(e) {
	if (ob) {
		if (N) {
			ob.style.top = (e.pageY-Y)+"px";
			ob.style.left = (e.pageX-X)+"px";
		}
		else {
			var version = 6;
			if (browser=='Internet Explorer'){
					var detect = navigator.userAgent.toLowerCase();
					checkIt('msie');
					version = parseInt(detect.substr(place + thestring.length,3));
			}
			//only for old ie
			if (version<6){
				ob.pixelTop = (event.clientY-Y + document.body.scrollTop);
			}
			else{
				ob.pixelTop = scrolled[1]+(event.clientY-Y + document.body.scrollTop);
			}				
			//x pos
			ob.pixelLeft = (event.clientX-X + document.body.scrollLeft);
			return false;
		}
	}
}

function MU() {	
	if (browser=='Opera'){
		scrolled=new Array();
		scrolled[1]=0;
	}
	else{
		scrolled=getScrollXY();
	}
	ob = null;
}

if (N) {
	document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP);
}

document.onmousedown = MD;
document.onmousemove = MM;
document.onmouseup = MU;