var fs_display = false;
var fs_height  = 0;

function popup(url_int,name_int){
	//Settings
	left_int = (screen.width/2)-500;
	top_int = (screen.height / 2) - 300;
	extras_int = "toolbar=no,location=no,width=1000,height=600,scrollbars=yes,left="+left_int+",top="+top_int;
	window.open(url_int,"",extras_int);
}

function camao_newuploadedImage(uID){ 

	container = document.createElement("div");
		input1 = document.createElement("input");
			imageDIV = document.createElement("div");
				uploadedImage = document.createElement("img");

	deleteContainer = document.createElement("div");
		input2 = document.createElement("input");
		newA = document.createElement("a");
			deleteImg = document.createElement("img");
			newSpan = document.createElement("span");




container.id = "upload_" + uID;

	input1.type = "hidden";
	input2.type = "hidden";

	container.appendChild(input1);
	container.appendChild(imageDIV);

	newA.appendChild(deleteImg);
	newA.appendChild(newSpan);

	deleteContainer.appendChild(input2);
	deleteContainer.appendChild(newA);

	container.appendChild(deleteContainer);

	if ($("image_list").innerHTML.indexOf("not uploaded")){
		$("image_list").innerHTML = "";
	}

	$("image_list").appendChild(container);



	newImage = "<img onmouseover='display_img_fs(this,163,86)' src='showUploadedImage.php?pid=" + uID + "'/>";
	imageDIV.innerHTML = newImage;

	newSpan.innerHTML = "Delete Picture";

	deleteImg.src = "/icons/24x24/plain/delete.png";
	deleteImg.className = "icon";

	eval("newA.onclick= function(){ delete_image(" + uID + "," + uID + ");}");



}
var imageHandlerObj;

function camao_activate(){
	
}

function camao_viewimage(element){
	display_img_fs(element,163,86);
}

function imageHandler(){
	this.show = function(imageUrl){
		$("layerImage").src = imageUrl;

		$("layerContainer").style.display = "";

		$("layerClose").onclick = function(){
			$("layerContainer").style.display = "none";
		}

		$("layerContainer").onmousemove = function(event){
			imageHandlerObj.onMouseMoveEvent();
		}
	}

	this.onMouseMoveEvent = function(event){
		console.log(event);
	}

}



function windows(){
	return(document.all?true:false);
}
function js_redirect(url){
	window.location = url;
}
function $(id){
	return(document.getElementById(id));
}

function fs_stop_following(){
	document.onmousemove = ""
	$('fs').innerHTML = "";
	$("fs").style.left = "0px";
	$("fs").style.top  = "0px";
	$("fs").style.display = "none";
	fs_display = 0;
}
function fs_xy(e){
	var scroll_top  = document.documentElement.scrollTop    ? document.documentElement.scrollTop  : document.body.scrollTop;
	var scroll_left = document.documentElement.scrollLeft   ? document.documentElement.scrollLeft : document.body.scrollLeft;

	// The doctype changes the values of the below, so just use documentElement whilest the doctype is defined.
	//var win_height  = document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight;
	var win_height    = document.documentElement.clientHeight;
	if (windows()) {
		X = event.clientX + scroll_left;
		Y = event.clientY + scroll_top;
	} else {
		X = e.pageX
		Y = e.pageY
	}

	// Define how much padding there is
	var padding = 20;

	// We need to make sure the image fits on the page
	y_mod = Y + 1 + "px";

	if(Y + (fs_height+padding) > (win_height+scroll_top)){
		// The image is too big to fit align it to the bottom
		y_mod = (win_height+scroll_top) - (fs_height+padding);
	}
	else {
		// The image fits align with mouse.
		y_mod = Y;
	}

	$("fs").style.left = X + 20 + "px";
	$("fs").style.top  = y_mod + "px";
}
function display_img_fs(obj,width,height){
	// Set the height
	fs_height = height;

	if(fs_display){
		fs_stop_following();
	}
	else {
		// Follow the mouse
		document.onmousemove = fs_xy;

		// Associate the stop function
		obj.onmouseout = function(){
			fs_stop_following();
		}

		// Set the flag
		fs_display = 1;

		// Delay the launch
		window.setTimeout(function(){
			if(fs_display){
				// Display the image
				var src = obj.src;
				src = src.replace(/ms_/,"fs_");
				src = src.replace(/tn_/,"fs_");
				src = src.replace(/pid=/,"fss=true&pid=");

				$('fs').innerHTML = "\
					<img src='"+src+"' alt='Loading preview...'/>\
				";
				$('fs').style.display = "block";
			}
		},100);
	}
}
function v_change_image(url,width,height){
	// Define what we are currently using as a max height
	max_height = 220;
	$("display_image").height = height;
	$("display_image").width  = width;
	$("display_image").src    = url;
	y_mod = parseInt((max_height-height) / 2);
	if(y_mod > 0){
		$("display_image").style.marginTop = y_mod + "px";
	}
	else {
		$("display_image").style.marginTop = 0 + "px";
	}
}



var newW = false;
function newWin(url,W,H,S,L,T)
{
	if(newW){
		newW.close();
	}
	if(!W){
		W=450;
	}
	if(!H){
		H=400;
	}
	if(!S)S="yes";
	if(!L){
		L = Math.floor((screen.availWidth - W)/1.5);
	}
	if(!T){
		T = Math.floor((screen.availHeight - H)/5);
	}
	//location=yes,
	newW = window.open(url,"newW","scrollbars="+S+",status=no,resizable=yes,width="+W+",height="+H+",left="+L+",top="+T);
	newW.focus();
}


function showHide(id, linkId, openText, closeText){
	element = document.getElementById(id);
	linkElement = document.getElementById(linkId);
	
	if (element.style.display == 'none'){
		element.style.display = '';
		linkElement.innerHTML = '<span class="open">' + openText + '</span>';
	} else {
		element.style.display = 'none';
		linkElement.innerHTML = '<span class="closed">' + closeText + '</span>';
	}
	
}