// Email validation... TODO



var PhotoBrowser =
{
	currentPosition:0,
	currentLocation:null,
	loadingLocation:null,
	lang:'en',
	photos:new Array(),
	currentImage:0,
	year:2011,

	load : function() {
		this.loadingLocation = $( ".pageContent select#locationList option:selected" ).val();
		
		
		// Set the ID for the location gallery.
		$( ".pageContent .locationGallery" ).attr( "id", "gallery-" + this.loadingLocation );

		this.photos = new Array();
		$.get(
			'gBase.php', 
			{location: this.loadingLocation, y:this.year},  
			function(responseText) {
				if( responseText != '0' ) {
					PhotoBrowser.currentLocation = PhotoBrowser.loadingLocation;
					var image_data = responseText.split( "~" ); // Each image element is "filename.jpg|Submitter name|caption en|captionfr"
					for( var i = 0; i < image_data.length; i++ ) {
						var data = image_data[i].split("|");
						PhotoBrowser.photos[i] = { filename: data[0], submitter: data[1], caption_en: data[2], caption_fr: data[3], id: data[4] };
					}
					
					
					$( ".pageContent a.button_previousImages" ).removeClass( "visible" );
					
					// Hide the next button if there are fewer than 5 images.
					if( PhotoBrowser.photos.length <= 4 )
						$( ".pageContent a.button_nextImages" ).addClass( "hidden" );
					else
						$( ".pageContent a.button_nextImages" ).removeClass( "hidden" );
									
					// Make sure the gallery is visible.
					$( ".pageContent div.locationGallery" ).show();
									
					// Load all thumbnail images for this gallery.
					for( var i = 0; i < PhotoBrowser.photos.length; i++ ) {
						$( '.pageContent ul#thumbnailBrowser' ).append( '<li style="left:' + ( i * 81 + 5 ) + 'px;"><a href="#" onclick="return PhotoBrowser.loadPhotoDetails('+i+');" class="blitzPhoto"><img src="photo.php?loc=' + PhotoBrowser.currentLocation +'&amp;y=' + PhotoBrowser.year + '&amp;f=' + PhotoBrowser.photos[ i ].filename + '" alt="Photo '+i+'"/></a></li>' );
					}						
					
					// Show the first photo in the list.
					PhotoBrowser.loadPhotoDetails( 0 );
				
					//$( ".pageContent ul#thumbnailBrowser" ).append( "<li><a href='#' class='blitzPhoto loading'><span class='ajaxLoader'></span></a></li>" );
				} else {
					// Unable to find any results for the requested gallery.
					$( ".pageContent div.locationGallery" ).hide();
					
					// Show error message.
					$( ".pageContent div.locationGallery" ).after( "<p class='center noImagesError'>"+(PhotoBrowser.lang == 'fr' ? 'Galerie introuvables.': 'Could not find images for this gallery.')+'</p>' );
				}
			}
		);
	},
	
	
	unload : function()
	{
		// Remove the thumbnails in the gallery.
		$( ".pageContent ul#thumbnailBrowser" ).empty();
		
		// Hide the current item being viewed.
		//$( ".pageContent div.locationGallery div.userSubmission" ).fadeOut( 200, function(){ $( this ).empty(); });
		
		// Remove any error messages.
		$( ".pageContent p.noImagesError" ).remove();
	},
	
	
	loadPhotoDetails : function( image_index ) {
		this.currentImage = image_index;
		// Hide the current item being viewed.
		$( ".pageContent div.locationGallery div.userSubmission" ).fadeOut( 200, function() {
			var p = PhotoBrowser.photos[image_index];
			// Remove the elements
			$( this ).empty();
			
			$( this ).append( "<a href='#' onclick='return false;' id='midPreview'><img src='photo.php?loc=" + PhotoBrowser.currentLocation +'&amp;y=' + PhotoBrowser.year + '&amp;f=' + p.filename + "&amp;s=pic' alt=''/></a>" );
			
			$( this ).append( "<p><strong>"+(PhotoBrowser.lang=='fr'?"Soumis par":"Submitted by")+" "+p.submitter+"</strong></p>" );
			var caption_preferred = PhotoBrowser.lang == 'fr' ? p.caption_fr : p.caption_en;
			var caption_alternate = PhotoBrowser.lang == 'fr' ? p.caption_en : p.caption_fr;
			var caption = caption_preferred ? caption_preferred : caption_alternate;
			$( this ).append( $('<p id="theCaption"/>').text(caption) );
			var linkText = '';
			if (!caption)
				linkText = PhotoBrowser.lang == 'fr' ? 'Ajouter une légende' : 'Add caption...';
			else if (!caption_preferred)
				linkText = PhotoBrowser.lang == 'fr' ? 'Traduire cette légende' : 'Translate this caption...';
			else
				linkText = PhotoBrowser.lang == 'fr' ? 'Modifier cette rubrique' : 'Edit caption...';
			$(this).append('<br /><br /><p><a href="#" onclick="PhotoBrowser.showCaptionEdit(this); return false;">'+linkText+'</a></p>');
			
			$( this ).fadeIn( 200 );
		});
		return false;
	},
	
	showCaptionEdit : function(linkElement) {
		$('#theCaption').replaceWith($('<textarea id="theNewCaption"></textarea>').text($('#theCaption').text())); 
		$(linkElement).replaceWith('<a href="#" style="font-weight: bold;" onclick="PhotoBrowser.saveCaptionEdit(this); return false;">'+(this.lang == 'fr' ? 'Enregistrer les modifications':'Save changes')+'</a>');
	},
	
	saveCaptionEdit : function(linkElement) {
		var p = this.photos[this.currentImage];
		var newCaption = $("#theNewCaption").val();
		$.get(
			'gBase.php', 
			{action: 'caption', pid: p.id, caption: newCaption, lang: this.lang},
			function(responseText) {
				if (responseText != "Updated")
					alert("Error: "+responseText);
			}
		);
		if (this.lang == "en")
			this.photos[this.currentImage].caption_en = newCaption;
		else
			this.photos[this.currentImage].caption_fr = newCaption;
		$('#theNewCaption').replaceWith( $('<p id="theCaption"/>').text(newCaption) ); 
		$(linkElement).replaceWith('<a href="#" onclick="PhotoBrowser.showCaptionEdit(this); return false;">'+(this.lang == 'fr' ? 'Modifier cette rubrique' : 'Edit caption...')+'</a>');
	},

	nextImage : function()
	{
		var gallerySize = $( ".pageContent ul#thumbnailBrowser" ).children( "li" ).length;
	
		// Shift all the images to the left.
		this.currentPosition++;
				
		// Display the previous button.
		if( this.currentPosition > 0 && !$( ".pageContent a.button_previousImages" ).hasClass( "visible" ))
			$( ".pageContent a.button_previousImages" ).addClass( "visible" );
		
		// Hide the next button.
		if( this.currentPosition > ( gallerySize - 5 ))
			$( ".pageContent a.button_nextImages" ).addClass( "hidden" );
		
		// Animate the images shifting to the left.
		$( ".pageContent ul#thumbnailBrowser li" ).animate({ "left" : "-=" + 81 }, 200 );
	},
	
	
	previousImage : function()
	{
		var gallerySize = $( ".pageContent ul#thumbnailBrowser" ).children( "li" ).length;
	
		// Shift all the images to the left.
		this.currentPosition--;		
				
		// Hide the previous button
		if( this.currentPosition < 1 )
			$( ".pageContent a.button_previousImages" ).removeClass( "visible" );
		
		// Show the next button
		if( this.currentPosition < ( gallerySize -4 ))
			$( ".pageContent a.button_nextImages" ).removeClass( "hidden" );
		
		// Animate the images shifting to the right.
		$( ".pageContent ul#thumbnailBrowser li" ).animate({ "left" : "+=" + 81 }, 200 );
	},
	
	registerEvents : function() 
	{
		// Set the focus to the first field on the Share Photos page.
		$( "div#sharePhotos.pageContent input#identityName" ).focus();


		// Bind the next arrow in the Photo Gallery.
		$( ".pageContent div.locationGallery a.button_nextImages" ).click( function()
		{
			PhotoBrowser.nextImage();
			return false;
		});
		
		
		// Bind the previous arrow in the Photo Gallery.
		$( ".pageContent div.locationGallery a.button_previousImages" ).click( function()
		{
			PhotoBrowser.previousImage();
			return false;
		});
		
		
		// Change the gallery.
		$( ".pageContent select#locationList" ).change( function()
		{
			// Some browsers report selecting the same element as a change. Prevent reloading data.
			if( $( ".pageContent select#locationList option:selected" ).val() == $( ".pageContent .locationGallery" ).attr( "id" ))
			{
				return;
			}
			
			PhotoBrowser.currentPosition = 0;
			
			// Remove the existing thumbnails...
			PhotoBrowser.unload();
			
			// Load the new gallery
			PhotoBrowser.load();
		});
	}
};