var container = "featured";
var perRow = 5;
var numImgs = 0;
var heightAll = 0;
var heightOne = 132;

function prepareFeatured () {
	if ($(container)) {
		
		//heightOne = Element.getHeight($(container));
		
		var currPage = new String(document.location).split("/").pop()
		new Ajax.Request(
			currPage,
			{
				method: 'post',
				parameters: "xml=true",
				onLoading: loading,
				onComplete: setupFeatured
			}
		);
		
	}
}

function loading () {
	var waitingDiv = document.createElement("div");
	waitingDiv.className = "waiting-big";
	$(container).appendChild(waitingDiv);
}

function setupFeatured (xml) {
	allXML = xml;
	
	var imgs = xml.responseXML.getElementsByTagName("img");
	numImgs = imgs.length;
	heightAll = Math.ceil(numImgs / perRow) * heightOne;
	
	// clear out anything inside the container
	while ($(container).childNodes.length > 0) {
		$(container).removeChild($(container).childNodes[0]);
	}
	
	for (var i = 0; i < imgs.length; i++) {
		var bigURL = imgs[i].attributes[0].nodeValue.replace(/featured/,"featured_big");
		var dress = document.createElement("div");
		dress.className = "dress";
		
		var a = document.createElement("a");
		a.setAttribute("href", bigURL);
		a.setAttribute("rel", "lightbox[featured]");
		a.setAttribute("title", '<a href="' + bigURL + '" onclick="window.print();return false;">Print this dress</a>');
		
		var img = document.createElement("img");
		img.setAttribute("src", imgs[i].attributes[0].nodeValue); // cross-browser
		img.setAttribute("alt", imgs[i].attributes[1].nodeValue); 
		img.setAttribute("title", imgs[i].attributes[1].nodeValue); 
		a.appendChild(img);
		dress.appendChild(a);
		
		$(container).appendChild(dress);
	}
	
	// create more link:
	$("more-button").onmousedown = expandFeatured;
	$("more-button").style.display = "block";
	$("more-button-text").innerHTML = "View All Featured Dresses";
	
	// re-initialize lightbox to catch new images
	initLightbox();
}

function expandFeatured () {
	new Rico.Effect.Size(
		container,
		null, // don't need to change the width
		heightAll, // bump height to...
		1000, // ms
		20, // 10 steps
		{
			complete:  function() {
				$("more-button-text").innerHTML = "View Fewer Featured Dresses";
				$("more-button").onmousedown = collapseFeatured;
			}
		}
	);
}
function collapseFeatured () {
	new Rico.Effect.Size(
		container,
		null, // don't need to change the width
		heightOne, // bump height to...
		1000, // ms
		20, // 20 steps
		{
			complete:  function() {
				$("more-button-text").innerHTML = "View All Featured Dresses";
				$("more-button").onmousedown = expandFeatured;
			}
		}
	);
}

Event.observe(window, 'load', prepareFeatured, false);