collectionList = new ajaxObject("AJAX/fetch_photosets.lasso");
collectionList.callback = function(responseText, responseStatus){
	eval("collections = " + responseText);
	if(collections.stat == "ok"){
		$("thumbnail-browser-container").update();
		for(i=0; i<collections.photosets.photoset.length; i++){
			temp = new Element("option", {value: collections.photosets.photoset[i].id});
			temp.innerHTML = collections.photosets.photoset[i].title._content;
			$('selectCollections').insert(temp);
		}
	}
}

photoList = new ajaxObject("AJAX/fetch_photos.lasso");
photoList.callback = function(responseText, responseStatus){
	eval("photos = " + responseText);
	if(photos.stat == "ok"){
		//$('thumbnailContainer').update();
		thumbnailList = new Element("ul");
		thumbnailListString = "";
		key = galleryKey[activeListingView];
		index = -1;
		for(i=0; i<photos.photoset.photo.length; i++){
			width = photos.photoset.photo[i].width_s;
			height = photos.photoset.photo[i].height_s;
			ratio = (width / height).toFixed(2);
			offsetLeft = 0;
			offsetTop = 0;
			if((width / 2) >= 100)
				offsetLeft = width / 4;
			if((height / 2) >= 100)
				offsetTop = height / 4;
			src = photos.photoset.photo[i].url_s;
			if((width < 100) || (height < 100))
				src = photos.photoset.photo[i].url_m;
				
			//thumbnailList.insert("<li><div style='width: 100px; height: 100px; overflow: hidden; float: left; margin: 2px;' onClick=\"photoDetail.update('photoID=" + photos.photoset.photo[i].id + "&ratio=" + ratio + "');\"><img style='position: relative; top: -" + offsetTop +"px; left: -" +  offsetLeft + "px;' src='" + src + "'></div></li>");
			thumbnailListString += "<li class=style-2><div class='style-1' onClick=\"photoDetail.update('photoID=" + photos.photoset.photo[i].id + "&ratio=" + ratio + "');\"><img style='cursor: pointer; position: relative; top: -" + offsetTop +"px; left: -" +  offsetLeft + "px;' src='" + src + "'></div></li>";

			if(((i + 1) % 6) == 0){
				index = ((i+1) / 6);
				//alert(i + " " + index)
				thumbnailSlide = new Element("div", {"id" : listingPrefix[activeListingView] + "gallery-slide-" + index, "class": "gal-slide-box"});
				if(index == 1){
					thumbnailSlide.insert("<ul>" + thumbnailListString + "</ul>");
					$(listingPrefix[activeListingView] + "thumbnailContainer").insert(thumbnailSlide);
					thumbnailSlide.writeAttribute({"style" : "display: '';"});
					
					$(listingPrefix[activeListingView] + "gallery-dot-index").innerHTML = "";
					$(listingPrefix[activeListingView] + "gallery-dot-index").insert("<li id='" + listingPrefix[activeListingView] + "gallery-dot-" + index + "' class=active_slide></li>");
					slideTracker[key].pairs = {};
					slideTracker[key].pairs[listingPrefix[activeListingView] + 'gallery-dot-' + index] = listingPrefix[activeListingView] + 'gallery-slide-' + index;
					slideTracker[key].slideIndex = [];
					slideTracker[key].slideIndex[0] = [];
					slideTracker[key].slideIndex[0] = [listingPrefix[activeListingView] + 'gallery-dot-' + index, listingPrefix[activeListingView] + 'gallery-slide-' + index];
					updateButtons(key);
					thumbnailListString = "";
				}
				else{
					thumbnailSlide.insert("<ul>" + thumbnailListString + "</ul>");
					$(listingPrefix[activeListingView] + "thumbnailContainer").insert(thumbnailSlide);
					thumbnailSlide.writeAttribute({"style" : "display: none;"});

					$(listingPrefix[activeListingView] + "thumbnailContainer").insert("<div id='" + listingPrefix[activeListingView] + "gallery-slide-" + index + "' style='display: none;'></div>");
					$(listingPrefix[activeListingView] + "gallery-dot-index").insert("<li id='" + listingPrefix[activeListingView] + "gallery-dot-" + index + "' class=inactive_slide></li>");
					slideTracker[key].pairs[listingPrefix[activeListingView] + 'gallery-dot-' + index] = listingPrefix[activeListingView] + 'gallery-slide-' + index;
					slideTracker[key].slideIndex[slideTracker[key].slideIndex.length] = [listingPrefix[activeListingView] + 'gallery-dot-' + index, listingPrefix[activeListingView] + 'gallery-slide-' + index];
					updateButtons(key);
					thumbnailListString = "";
				}

				
			}
			
		}
		if(photos.photoset.photo.length < 6){

		}
		if(thumbnailListString != ""){
			index++;
			thumbnailSlide = new Element("div", {"id" : listingPrefix[activeListingView] + "gallery-slide-" + index, "class": "gal-slide-box"});
			thumbnailSlide.insert("<ul>" + thumbnailListString + "</ul>");
			$(listingPrefix[activeListingView] + "thumbnailContainer").insert(thumbnailSlide);
			if(photos.photoset.photo.length > 6){
				thumbnailSlide.writeAttribute({"style" : "display: none;"});

				$(listingPrefix[activeListingView] + "thumbnailContainer").insert("<div id='" + listingPrefix[activeListingView] + "gallery-slide-" + index + "' style='display: none;'></div>");
				$(listingPrefix[activeListingView] + "gallery-dot-index").insert("<li id='" + listingPrefix[activeListingView] + "gallery-dot-" + index + "' class=inactive_slide></li>");
				slideTracker[key].pairs[listingPrefix[activeListingView] + 'gallery-dot-' + index] = listingPrefix[activeListingView] + 'gallery-slide-' + index;
				slideTracker[key].slideIndex[slideTracker[key].slideIndex.length] = [listingPrefix[activeListingView] + 'gallery-dot-' + index, listingPrefix[activeListingView] + 'gallery-slide-' + index];
			}
			updateButtons(key);

		}
		//load the first photo into the container
		photoDetail.update("photoID="+photos.photoset.photo[0].id + "&ratio=" + (photos.photoset.photo[0].width_s / photos.photoset.photo[0].height_s).toFixed(2));
	}
}

photoDetail = new ajaxObject("AJAX/fetch_photo.lasso");
photoDetail.callback = function(responseText, responseStatus){
	eval("currentPhoto = " + responseText);
	styleTag = "width: 95%; height: auto;";
	if(currentPhotoRatio[activeListingView] < 1)
		styleTag = "width: auto; height: 95%;";
	if(currentPhoto.stat == "ok"){
		$(listingPrefix[activeListingView] + 'photoContainer').update().insert("<span></span>");
		$(listingPrefix[activeListingView] + 'photoContainer').insert(new Element('img').writeAttribute({"src": "http://farm" + currentPhoto.photo.farm + ".static.flickr.com/" + currentPhoto.photo.server + "/" + currentPhoto.photo.id + "_" + currentPhoto.photo.secret + ".jpg", "onClick": "zoomPhoto('" +"http://farm" + currentPhoto.photo.farm + ".static.flickr.com/" + currentPhoto.photo.server + "/" + currentPhoto.photo.id + "_" + currentPhoto.photo.secret + "_b.jpg" + "');", style: styleTag + "margin: 0 auto; border: 10px solid #ffffff; cursor: pointer;"}));
		$(listingPrefix[activeListingView] + 'photoTitle').update().insert("<h1>" + currentPhoto.photo.title._content + "</h1>");
		$(listingPrefix[activeListingView] + 'photoDescription').update().insert(currentPhoto.photo.description._content);
		
	}
}

function zoomPhoto(img){
	//if ipad is landscape:
	//	width = photooverlaycontainer.style.width * .9 * currentphotoratio
	//	height = photooverlaycontainer.style.height * .9
	//else
	//	height = photooverlaycontainer.style.width * .9 / currentphotoratio
	//	width = photooverlayocntainer.style.height * .9
	$("photoOverlayContainer").appear();
	$('photoOverlay').update().insert(new Element('img').writeAttribute({"class": "image-border", "id": "zoomedPhoto", "src": img, "width": "95%", "height" : "95%", style: "float: left; border: 10px solid #ffffff; cursor: pointer;"}));
	resizeZoomedPhoto();
}

function closeOverlay()
{
	$("photoOverlayContainer").hide();
}

function resizeZoomedPhoto(){
	if(!$('zoomedPhoto'))
		return;
	if((window.orientation == 0) || (window.orientation == 180)){  //portrait
		newHeight = 691 / currentPhotoRatio[activeListingView];
		newWidth = 691;
		if(newHeight > 925){
			newWidth = 691 * 925 / newHeight;
			newHeight = 925;
		}
	}
	else{  //landscape
		newWidth = 621 * currentPhotoRatio[activeListingView];
		newHeight = 621;
		if(newWidth > 925){
			newHeight = 621 * 925 / newWidth;
			newWidth = 925;
		}
	}
	$('photoOverlay').writeAttribute({style: "width: "+ newWidth.toFixed(0) + "px; height: " + newHeight.toFixed(0) + "px; top: 0px; z-index: -1;"});
	$('overlayRelativeBox').writeAttribute({style: "width: " + newWidth.toFixed(0) + "px;"});
/*
	if(currentPhotoRatio > 1){
		$('photoOverlay').style.width = "100%";
		$('photoOverlay').style.height = "auto";
	}
	else{
		$('photoOverlay').style.width = "auto";
		$('photoOverlay').style.height = "100%";
	}*/
}