var box = document.getElementById('hiddenbox');
var boxopc = document.getElementById('hiddenboxopc');
var height, width;
var action = '';
var parameters;
var albumID;
try{
	height = document.body.offsetHeight;
	width = document.body.offsetWidth;
}catch(e){
	height = window.innerHeight;
	width = window.innerWidth;
}
function showhidebox(){
	if(box.style.display == 'none'){
		box.style.display = 'block';
		boxopc.style.display = 'block';
	}else{
		box.style.display = 'none';
		boxopc.style.display = 'none';
	}
	xpos = (width - box.offsetWidth) / 2;
	box.style.left = xpos+'px';
	boxopc.style.left = (xpos - 10)+'px';
	box.style.top = 200+'px';
	boxopc.style.top = 190+'px';
}

function performAction(a, params){
	action = a;
	parameters = params;
	if(a=='login'){
		loginForm();
	}
	if(a=='newnetwork'){
		newnetworkForm();
	}
	if(a=='renamePhotoAlbum'){
		renamePAlbum();
	}
	if(a=='deleteAlbum'){
		deleteAlbumBox();
	}
	if(a=='contacts'){
		showContacts();
	}
	if(a=='deletePhoto'){
		deletePhotoBx();
	}
	if(a=='invite'){
		inviteInfo();
	}
}

function inviteInfo(){
	box.innerHTML = '<div style="padding:20px;"><h2>Invite</h2>\
		<p>\n\
			In beta stages of production you can invite others to use Public Size these will add credit to you to be entered into the contest to win our $1,000 prize!\n\
			You can copy the link to Facebook, MySpace, YouTube, your email, or anywhere you want. The more active members you get signed up the better your chances of winning!\n\
		</p>\n\
		<p>\n\
			Inviting others is NOT the only requirement to win the $1,000, you must also stay active, by participating in the network too. So stay active!\n\
		</p>\n\
		<p>\n\
			<input type="button" value="Close" onclick="showhidebox();" class="btnCancel" />\n\
		</p></div>';
}

function loginForm(){
	box.innerHTML = '<form action="/?p=login" method="post" style="padding:20px;">\
		<h2>Login</h2>\
		<input type="hidden" name="r" value="'+window.location.toString()+'" />\
		<div><input type="text" onfocus="if(this.value==\'Email or Username\'){this.value=\'\';}" onblur="if(this.value==\'\'){this.value=\'Email or Username\';}" name="username" value="Email or Username" />\
		<input type="text" onfocus="if(this.value==\'Password\'){this.type=\'password\';this.value=\'\'}" onblur="if(this.value==\'\'){this.type=\'text\';this.value=\'Password\'}" name="password" value="Password" /></div>\
		<div style="margin-top:10px;"><input type="checkbox" name="stayin" value="1" id="stayin" /><label for="stayin">Keep me logged in.</label></div>\
		<div style="margin-top:40px;"><input type="submit" value="Login" class="btnConfirm" /> <input type="button" value="Close" onclick="showhidebox();" class="btnCancel" /></div>\
	</form>';
}

function newnetworkForm(){
	box.innerHTML = '<div style="padding:20px;">\
		<h2>New Network Name</h2>\
		<div><input type="text" id="newNetworkName" onfocus="if(this.value==\'Network Name\'){this.value=\'\';}" onblur="if(this.value==\'\'){this.value=\'Network Name\';}" value="Network Name" />\
		<div style="margin-top:40px;"><input type="button" onclick="checkForNetwork();" value="Start Network" class="btnConfirm" /> <input type="button" value="Close" onclick="showhidebox();" class="btnCancel" /></div>\
		<div style="margin-top:30px;display:none;" id="smallLoadingNetwork"><img src="/images/loading.gif" alt="Loading... "></div>\
	</div>';
}

function renamePAlbum(){
	var val = parameters.replace(/\{34\}/i, "&apos;");
	val = val.replace(/\{39\}/i, "&quot;");
	box.innerHTML = '<div style="padding:20px;">\
		<h2>Rename Album</h2>\
		<div><input type="text" id="newAlbumName" onfocus="if(this.value==\''+val+'\'){this.value=\'\';}" onblur="if(this.value==\'\'){this.value=\''+val+'\';}" value="'+val+'" />\
		<div style="margin-top:40px;"><input type="button" onclick="RenameAlbum();" value="Rename Album" class="btnConfirm" /> <input type="button" value="Close" onclick="showhidebox();" class="btnCancel" /></div>\
		<div style="margin-top:30px;display:none;" id="smallLoadingAlbumRename"><img src="/images/loading.gif" alt="Loading... "></div>\
	</div>';
}

function deleteAlbumBox(){
	box.innerHTML = '<div style="padding:20px;">\
		<h2>Delete Album</h2>\
		<div class="error"><b>Wait!</b><p>Are you sure you want to delete this album? Deleting this will also permanently remove all of its images too!</p></div>\
		<div style="margin-top:10px;"><input type="button" onclick="deleteAlbum();" value="Delete Album" class="btnConfirm" /> <input type="button" value="Cancel" onclick="showhidebox();" class="btnCancel" /></div>\
		<div style="margin-top:10px;display:none;" id="smallLoadingAlbumDelete"><img src="/images/loading.gif" alt="Loading... "></div>\
	</div>';
}

function showContacts(){
	box.innerHTML = '';
	var connect = Post();
	connect[0].onreadystatechange = function(){
		if(connect[0].readyState == 4){
			var contacts = new Array();
			var total = 0;
			eval(connect[0].responseText);
			var opt = '';
			opt += '<div style="padding:20px;">\
				<h2>Contact List</h2>';
				opt += '<div style="overflow:auto;height:130px;">';
				opt += '<table><tr>';
				var i = 0;
				for(var contact in contacts){
					opt += '<td onclick="addContact('+contact+', \''+contacts[contact]['name']+'\', this)" class="'+((is_contact(contact))?'blocksel6':'block6')+'" style="vertical-algin:middle;">';
						opt += '<img style="float:left;margin-right: 5px;" src="'+contacts[contact]['picture']+'" />';
						opt += '<span style="float:left;margin-top:20px;">'+contacts[contact]['name']+'</span>';
					opt += '</td>';
					if(i==1){
						opt += '</tr><tr>';
						i = 0;
					}
					i++;
				}
				opt += '</tr></table>';
				opt += '</div>\
				<div style="margin-top:10px;"><input type="button" onclick="setContacts();showhidebox();" value="Use Contacts" class="btnConfirm" /> <input type="button" value="Cancel" onclick="showhidebox();" class="btnCancel" /></div>\
			</div>';
			box.innerHTML = opt;
		}
	};
	var va = '';
	connect[0].open("POST", '/?p=getContacts', true);
	connect[0].setRequestHeader("Content-Type", connect[1]);
	connect[0].send(va);
}

function deletePhotoBx(){
	box.innerHTML = '<div style="padding:20px;">\
		<h2>Delete Photo</h2>\
		<div class="error"><b>Wait!</b><p>Are you sure you want to delete this photo? This is a permanent action!</p></div>\
		<div style="margin-top:10px;"><input type="button" onclick="deletePhoto();showhidebox();" value="Delete Photo" class="btnConfirm" /> <input type="button" value="Cancel" onclick="showhidebox();" class="btnCancel" /></div>\
		<div style="margin-top:10px;display:none;" id="smallLoadingAlbumDelete"><img src="/images/loading.gif" alt="Loading... "></div>\
	</div>';
}
