// JavaScript Document

var galDir ="images/albums/"
var thumbDir = galDir+"thumbs/";
function showGalleries() {
	$('carosel').hide();
	$('photoOP').hide();
	var myTemplate = new Template('<option value="#{gal_ID}">#{gal_title}</option>');
	var gall = 'Gallery: <select onchange="showAlbums(this.value);" id="gallChanger">'
	new Ajax.Request('handlers/ajaj_gallery.php', {
	  parameters:{'action':"getGalleries"},
	  onSuccess: function(transport, json) {
		json.galleries.each(
			function(gallOBJ){
				gall += myTemplate.evaluate(gallOBJ);
			}
		);
		gall += '</select>';
		new Insertion.Top($('gallery'), gall);
		showAlbums(json.galleries[0].gal_ID);
	  },
	  onFailure: function(){ alert("Error Retrieving Galleries. Please Try Again.");}
	});
}

function showAlbums(id) {
	$('photoOP').hide();
	if($('albumChanger') != null) {Element.remove($('albumChanger'));}
	var myTemplate = new Template('<option value="#{album_ID}">#{album_title}</option>');
	var album = '<select onchange="showThumbs(this.value);" id="albumChanger">';
	new Ajax.Request('handlers/ajaj_gallery.php', {
		parameters:{'action':"getAlbums",'ID':id},
		onSuccess: function(transport, json) {
			json.albums.each(
				function(albumOBJ){
					album += myTemplate.evaluate(albumOBJ);
				}
			);
			album += '</select>';
			new Insertion.After($('gallChanger'), album);
			showThumbs(json.albums[0].album_ID);
		},
		onFailure: function(){alert("Error Retrieving Albums. Please Try Again.");}
	});
}

function showThumbs(id) {
	var myTemplate = new Template('<a href="#" onclick="showImage(\'#{photo_img}\',\'#{photo_title}\',\'#{photo_description}\',\'#{photo_w}\',\'#{photo_h}\');return false;"><img src="'+thumbDir+'#{photo_img}" /></a>');
	var thumb = '';
	new Ajax.Request('handlers/ajaj_gallery.php', {
		parameters:{'action':"getImages",'ID':id},
		onSuccess: function(transport, json) {
			if (json.thumbs.size() < 1){thumb='<p>No Images Available</p>';}
			else {
				json.thumbs.each(
					function(thumbOBJ){
						thumbOBJ.photo_title=thumbOBJ.photo_title.escapeHTML();
						thumbOBJ.photo_description=thumbOBJ.photo_description.escapeHTML();
						thumb += myTemplate.evaluate(thumbOBJ);
					}
				);
			}
			$('carosel').innerHTML = "";
			new Insertion.Top($('carosel'), thumb);
			$('carosel').show();
			showImage(json.thumbs[0].photo_img, json.thumbs[0].photo_title, json.thumbs[0].photo_description, json.thumbs[0].photo_w, json.thumbs[0].photo_h)
		},
		onFailure: function(){alert("Error Retrieving Image. Please Try Again.");}
	});
}

function showImage(img, title, description, width, height) {
	$('photoOP').hide();
	var myTemplate = new Template('<img src="'+galDir+'#{img}" width="#{width}" height="#{height}" /> <h1>#{title}</h1><p>#{description}</p>');
	var data = {'img':img, 'title':title, 'description':description, 'width':width, 'height':height};
	$('photoOP').innerHTML = "";
	new Insertion.Top($('photoOP'), myTemplate.evaluate(data));
	new Effect.Appear($('photoOP'));
	
}