// collaboration javascript
// (c) 2007 Blurb Inc

// amount of space occupied by other elements - such as header,
// bottom footer, etc. Anything that's not main content area.
var contentOffset = 310;
// the height that the content area should be, at a minimum.
var minimumHeight = 100;

// resizes the main content area to occupy most of the space
function resizeMainContentArea() {
	//hack to dispable resize of content pain.
	return;
	elem = $('contentMainArea');

	if (!elem) return;
	
	elemHeight = elem.getHeight();
	pageHeight = getPageSize()[3];
	
	if (contentOffset + elemHeight < pageHeight ||
		contentOffset + elemHeight > pageHeight) {
		newHeight = pageHeight - contentOffset;
		if (newHeight > minimumHeight) {
			elem.style.height = newHeight + "px";
		}
		// for debuggin:
		// elem.innerHTML = "PageHeight: " + pageHeight + 
		//				 "<br>ContentHeight: " + newHeight;
	} 
	
	if (elem.getHeight() < minimumHeight) {
		elem.style.height = minimumHeight + "px";
	}
}

// window.onresize event handler
Event.observe(window, 'resize', function() {
	resizeMainContentArea();
}); 	


function toggleSection(image, id) {
	elem = $(id);
	if (elem.visible()) {
		// hide!
		elem.hide();
//		Effect.Fade(elem, { duration: 0.3, queue: 'slide' });
		image.src = "/images/icons/sectionClosed.gif"
		elem.parentNode.style.borderBottomWidth = "0px";
	} else {
		// show!
		elem.show();
//		Effect.Appear(elem, { duration: 0.3, queue: 'slide'})
		image.src = "/images/icons/sectionOpened.gif"
		elem.parentNode.style.borderBottomWidth = "1px";
	}
}

function toggleControls(id, on) {
	elemName = "control_" + id.toString();
	elem = $(elemName);
	if (!on) {
		elem.hide();
	} else {
		elements = $$("div.sideControl").each(function(s, index) {
			if (s.id != elemName && s.visible()) s.hide();
		});
		elem.show();
	}
}

function attachMenu(div) {
	div = (div) ? "div." + div : "div.thumbnailMenuContainer";
	var elements = $$(div)

	// loop through all anchor tags
	for (var i=0; i<elements.length; i++){
		var thumb = elements[i];
		Event.observe(thumb, 'click', function(event) { showMenu(getEventElement(event), true); });
		Event.observe(thumb.parentNode, 'mouseover', function(event) {showHotSpot(getEventElement(event)); });
		Event.observe(thumb.parentNode, 'mouseout', function(event) { hideHotSpot(getEventElement(event)); });
		positionDropDown(thumb);
	}
	
	Event.observe(document, 'click', function(event) {
		 event = event || window.event;
		 var elt = Event.element(event);
	
	 	 var elements = $$(div);
	 	 elements.each(function(element, index) {
	 	 	element = $(element)
			clickedElsewhere = true;
			
	 	 	if (element.id == elt.id ||
	 	 		element.descendants().find(function(s) {return s == elt}) != null) {
				clickedElsewhere = false;	 	 		
	 	 	}
			if (clickedElsewhere) showMenu(element, false);
	 	 });
	})
}

function getEventElement(event) {
	 event = event || window.event;
	 return Event.element(event);
}

function showHotSpot(thumbContainer){
	elem = getElementWithSameId(thumbContainer, "hotSpotFor_");
	if (elem && !elem.visible()){
		elem.addClassName("hotSpotHover");
		elem.show();
	}
}

function hideHotSpot(thumbContainer){
	elem = getElementWithSameId(thumbContainer, "hotSpotFor_");
	if (elem && elem.visible()){
		elem.removeClassName("hotSpotHover");
		elem.hide();
	}
}

function getElementWithSameId(element, prefix){
	var div = $(element);
	if (!div.id){
		return null;
	}
    item_id = div.getAttribute("id").split("_")[1];
    return $(prefix + item_id);
}

function getDropDownForContainer(thumbContainer){
	return getElementWithSameId(thumbContainer, "thumbMenuFor_");
}

function positionDropDown(thumbContainer) {
    var div = $(thumbContainer);
    elem = getDropDownForContainer(div);
    if (!elem){
	  return null;
	}
    // elem.style.bottom = (23 - elem.getHeight()) + "px";
}

function showMenu(thumbContainer, turnOn) {
    var div = $(thumbContainer);
    elem = getDropDownForContainer(div);
	hotSpot = getElementWithSameId(elem, "hotSpotFor_");
	if (elem && hotSpot) {
		if (elem.visible() && turnOn == false) { 
			hotSpot.removeClassName("selectedHotspot");
			elem.removeClassName("selectedContainer"); 
			elem.hide();
		} else if (!elem.visible() && turnOn == true){	
			hotSpot.addClassName("selectedHotspot");
			elem.addClassName("selectedContainer"); 
			elem.show();
		}
	}	
}