// # init_imggal.js
//
// Initialize the jCarousel and Uploadify components for the image gallery
//
// NOTE: Make sure to set the session ID in whatever file is including this
// such as this php code: echo '<input type="hidden" id="CurSessID" name="CurSessID" value="' . session_id() . '" />';
//
// Date        Ver     Who        Notes
// ----------  ------  ---------  --------------------------------------------
// 04/30/2009  $$1     Jason      Created
// 08/19/2009  $$2     Jason      Move to uploadify v2 and fix jcarousel scrolling
//______

var mycarousel;

function mycarousel_initCallback(carousel) {
	mycarousel = carousel;
};

jQuery(document).ready(function($) {
								
	jQuery('#fileInput3').uploadify({
		'uploader':'/uploadify/uploadify.swf',
		'buttonText':'',
		'buttonImg':'/images/upload.png',
		'width':'167',
		'height':'55',
		'rollover':'true',
		'script':'/tools/image_uploader.php',
		'cancelImg':'/uploadify/cancel.png',
		'folder':'/uploadify/uploads',
		'scriptData': {'session_name': jQuery('#CurSessID').val()},
		'auto':true,
		'fileDesc':'Image File',
		'fileExt':'*.jpg;*.jpeg;*.png;*.gif',
		'sizeLimit':'3145728',   // 3MB
		'displayData':'percentage',
		'onComplete':function (event, queueID, fileObj, response, data) {
			var resp = JSON.parse(response);
			if( resp.error != "" ) {
				alert( "Error: " + resp.error );
			} else {
				var img = new Image();
				img.src = resp.thumb100;
				var pos = mycarousel.size() + 1;
				if( jQuery("div.galleryEmpty").length > 0 ) {
					// We put a dummy item in the carousel if the user is new and has no
					// images yet in their account, so the first time they add an image we
					// need to put that image in position 1
					pos = 1;
				}
				var imgalt = 'Photo|' + resp.width300 + '|' + resp.height300;
				var imghtml = '<div class="galleryThumbDiv"><a href="' + resp.thumb500 + '" rel="shadowbox"><img class="galleryThumb" alt=\"' + imgalt +
					'" src="' +	resp.thumb100 + '" /></p><a href="' + resp.thumb500 + '" rel="shadowbox"><img class="zoomImg" src="/images/mag_glass.png" ' +
					'title="Zoom" alt="Zoom" style="padding-left: ' + resp.pad + 'px" /></a><img class="cancelimg" src="/images/cancel.png" style="padding-right: ' + resp.pad + 'px" ' +
					'title="Delete" alt="Delete" onclick="remove_image(' + pos + ',\'' + resp.fname + '\',\'' + resp.dir + '\')" /></div>';
				mycarousel.add( pos, imghtml );
				mycarousel.size( pos );
				mycarousel.scroll( pos, true );
				Shadowbox.setup( jQuery('a[rel="shadowbox"]'), {
					resizeDuration: "0.15",
					fadeDuration: "0.15"
				});
				jQuery('.galleryThumb').draggable({ revert: true });
				changeImage( resp.thumb100, imgalt );
			}
			return( true );
		}
	});
	
	jQuery('#mycarousel').jcarousel({
		initCallback: mycarousel_initCallback,
		scroll: 2
	});

});

function remove_image( idx, image, imgdir ) {
	if( confirm( 'Are you sure you want to delete image ' + image + '?' ) ) {
		
		jQuery.get( '/tools/delete_image.php', { 'image':image },
				   function(data){ 
						resp = JSON.parse(data);
						if( resp.error != "" ) {
							alert( "Error: " + resp.error );
						} else {
							var cur_size = mycarousel.size();
							if( cur_size == 1 ) {
								// Removing the last image
								var newhtml = "<li><div class=\"galleryEmpty\"><img class=\"galleryThumb\" src=\"/images/blank.png\" width=\"100\" height=\"100\" /></div></li>\n";
								mycarousel.add( 1, newhtml );
								changeImage( 'images/image_preview_area.jpg', 'preview|300|300' );
							} else {
								var rm_idx = idx; // save this to find out if we need to scroll at the end
								while( idx < cur_size ) {
									var newhtml = mycarousel.get( idx+1 ).html();
									mycarousel.add( idx, newhtml );
									idx++;
								} 
								mycarousel.remove(idx);
								cur_size--;
								mycarousel.size(cur_size);
								if( rm_idx > cur_size ) {
									mycarousel.scroll( cur_size, false );
								}
								// If the user is removing the image that is currently being used in the preview, then set
								// the preview image to something else
								if( $('cardimage') ) {
									var sp = $('cardimage').value.split('/');
									var imgfile = sp[sp.length-1];
									if( imgfile == image ) {
										var FirstImg = jQuery('.galleryThumb:first');
										if( (FirstImg.size() > 0) && (FirstImg.attr('src') != '/images/blank100.png') ) {
											changeImage( FirstImg.attr('src'), FirstImg.attr('alt') );
											mycarousel.scroll( 1, false );
										}
									}
								}
							}
							jQuery('.galleryThumb').draggable({ revert: true });
						}
					});
		
	}
}