// registers an array of elements so that on mouseover, the classname has 'Hover' appended
function registerMouseOverClasses(elementIds) {
	for (var i = 0; i < elementIds.length; i++) {
		var el = document.getElementById(elementIds[i]);
		el.onmouseover = function() { setHoverClass(el); };
		el.onmouseout = function() { unsetHoverClass(el); };
	}
}

function setHoverClass(el) {
	 var curClass = el.className;
	 if (curClass == null || curClass.length == 0 || curClass.indexOf('Hover') > -1) {
		return;
	 }
	 
	 el.className = curClass + 'Hover';
}

function unsetHoverClass(el) {
	 var curClass = el.className;
	 if (curClass == null || curClass.length == 0 || curClass.indexOf('Hover') == -1) {
		return;
	 }
	 
	 el.className = curClass.replace('Hover', '');
}


function scrollToElement(elId) {
	var container = document.getElementById('otherPhotosDiv');
	var el = document.getElementById(elId);
	
	var x = el.offsetParent.offsetLeft;
	container.scrollLeft = x;
	
}

function mouseOverThumbnail(captionId) {
	var caption = document.getElementById(captionId);
	caption.mode = 'opening';
	updateCaption(caption);
}

function mouseOutThumbnail(captionId) {
	var caption = document.getElementById(captionId);
	caption.mode = 'closing';
	updateCaption(caption);
}



function updateCaption(caption) {

	var curHeight = (!caption.curHeight) ? 20 : parseInt(caption.curHeight);

	
	if (!caption.mode || caption.mode == 'stopped') {
		return;
	}
	
	if (caption.mode == 'opening') {
		var maxHeight = parseInt(caption.offsetHeight);
		curHeight+=2;
		if (curHeight > maxHeight) {
			caption.mode = 'stopped';
			return;
		}
	} else {
		var minHeight = 20;
		curHeight-=2;
		

		if (curHeight < minHeight) {
			caption.mode = 'stopped';
			return;
		}
	}
	
	caption.curHeight = curHeight;
	caption.style.clip = 'rect(0px, auto, ' + curHeight + 'px, 0px)';
	
	
	setTimeout( function() { updateCaption(caption); }, 2);
	
}

/********** style customisation ******/

var mainColourRule = null;
var borderColourRule = null;
function setColorScheme(colorCode) {
	if (document.styleSheets && document.styleSheets[0].rules) {
		if (canChangeRules()) {
			mainColourRule.style.backgroundColor = colorCode;
			borderColourRule.style.borderColor = colorCode;
		}
	} else {
		var styleNode = document.createElement('style');
		styleNode["type"] = 'text/css';
		var text = document.createTextNode(".MainColour { background-color: " + colorCode + "; } .MainBorder { border-color: " + colorCode + "; }");
		styleNode.appendChild(text);
		var toAddTo = document.getElementsByTagName('head')[0];
		toAddTo.appendChild(styleNode);
	}
}

function canChangeRules() {
	if (mainColourRule && borderColourRule) {
		return true;
	}
	for (var i = 0; i < document.styleSheets.length; i++) {
		var styleSheet = document.styleSheets[i];
		for (var j = 0; j < styleSheet.rules.length; j++) {
			var rule = styleSheet.rules[j];
			var selectorText = rule.selectorText;
			if (selectorText.indexOf('.MainColour') > -1) {
				mainColourRule = rule;
			} else if (selectorText.indexOf('.MainBorder') > -1) {
				borderColourRule = rule;
			}
		
			if (mainColourRule && borderColourRule) {
				return true;
			}
		}
	}
	return false;
}


/********** friends checkboxes *******/

function toggleFriends(groupCB, friendsContainer) {
	var checkboxes = friendsContainer.getElementsByTagName('input');
	for (var i = 0; i < checkboxes.length; i++) {
		checkboxes[i].checked = groupCB.checked;
	}
}

/********** FriendEmailer ************/

	
function emailPage(sendButton) {
	sendButton.disabled = true;
	sendButton.value = 'Sending...';
	
	var emails = document.getElementById('emailsTB').value;
	var message = document.getElementById('messageTB').value;
	var senderName = document.getElementById('fe_senderName').value;
	var senderEmail = document.getElementById('fe_senderEmail').value;
	
	// build array of friend ids
	var friendIds = new Array();
	var cbs = document.getElementById('groupsUl').getElementsByTagName('input');
	for (var i = 0; i < cbs.length; i++) {
		var cb = cbs[i];
		if (cb.checked && cb.id.indexOf('friend') == 0) {
			friendIds[friendIds.length] = parseInt(cb.id.substring(6));
		}
	}
	
	Picwa.Web.WebServices.SendPageToFriend(document.title, location.href, senderName, senderEmail, friendIds, emails, message, onEmailSent, onEmailFail);
	
}

function onEmailSent(result) {
	alert(result);
	var sendButton = document.getElementById('feButton');
	sendButton.disabled = false;
	sendButton.value = 'Send';
}

function onEmailFail(result) {
	alert(result.get_message());
	var sendButton = document.getElementById('feButton');
	sendButton.disabled = false;
	sendButton.value = 'Send';
}

function loadFriendsList(link, divId) {
	link.style.display = 'none';
	var friendDiv = document.getElementById(divId);
	friendDiv.style.display = 'block';
	
	Picwa.Web.WebServices.GetFriendsOfUser(onFriendsLoaded, onFriendsError, link);
	
	
}

function onFriendsLoaded(groups) {

	document.getElementById('feLoading').style.display = 'none';
	var groupsUl = document.getElementById('groupsUl');

	for(var i = 0; i < groups.length; i++) {
		var group = groups[i];
		
		if (group.Friends.length == 0) {
			continue;
		}

		var groupLi = document.createElement('li');
		groupsUl.appendChild(groupLi);
		
		var groupCb = createCb(groupLi, group.Name, 'group' + group.Id);
		
		var friendUl = document.createElement('ul');
		groupLi.appendChild(friendUl);
		
		groupCb.onclick = function() { toggleFriends(this, friendUl); };
		
		for (var j = 0; j < group.Friends.length; j++) {
			var friend = group.Friends[j];

			var friendLi = document.createElement('li');
			friendUl.appendChild(friendLi);
			var friendCb = createCb(friendLi, friend.Username, 'friend' + friend.Id);
			
			friendCb.onclick = function() { if (!this.checked) groupCb.checked = false; };
			

		}
		
	}
}

function onFriendsError(e, link) {
	if (e.get_message() == 'NotLoggedIn') {
	
		if (confirm('To select friends from your friends list, you need to first log in.')) {
			location.href = '/User/Login.aspx?returnUrl=' + escape(location.href);
			return;
		} else {
		}
	
	} else{
		alert(e.get_message());
	}
	
	document.getElementById('friendDiv').style.display = 'none';
	link.style.display = 'inline';
	
	
}

function createCb(groupLi, name, value) {
		var groupCb = document.createElement('input');
		groupCb.type = 'checkbox';
		groupCb.id = value;
		groupLi.appendChild(groupCb);
		
		var groupLabel = document.createElement('label');
		groupLabel.setAttribute('for', groupCb.id);
		groupLi.appendChild(groupLabel);

		var innerText = document.createTextNode(name);
		groupLabel.appendChild(innerText);
		
		return groupCb;
}