//dependencies jquery.form.js
//create delete X next to each thumbnail
//view files from Flikr??
//view_type: "manage", "display", "uploadOnly"

;(function($) {
	$.fn.extend({
        imGalleryManager: function(options) { 
        	opts = $.extend({}, $.imGallery.defaults, options);
			return this.each(function() {
				new $.imGallery(this, opts);
			});
		}
 	});
$.imGallery = function(obj, opts) {	
	var totalGalleries = 0;
	var _numPages = 0;
	var _pageNum = 0;
	var _selectedThumb = '';
	//var aNav = new Array();
	var selectedPage = '';
	var _pages = new Array();
	$this = $(obj);
	
	if (opts.file_types.match('jpg') && !opts.file_types.match('jpeg')) 
    	opts.file_types += ',jpeg';
    createGalleryCaption();        
	if ((opts.mode == 'manage') || (opts.mode == 'uploadOnly')) {
		createUploadForm();
	}
	if (opts.mode != 'uploadOnly') {
		if (createGallery()) {
			if (opts.mode == 'display') {
				getGalleryData();
			}
		}
	}
	
	function createGalleryCaption() {
		$this.append($('<div></div>')
			.attr("id", "galleryCaption")
			.html('<h3>Gallery Manager</h3>'));
	};
	
	function createUploadForm() {
		var h = '';
		var o = '';
		if (opts.upload.hidden_fields) {
			$.each(opts.upload.hidden_fields, function (i, itm) {
				h += '<input type="hidden" name="' + itm.name + '" value="' + itm.value + '" />';
			});
		}
		var upC = (opts.upload.caption) ? opts.upload.caption : opts.uploadCaption;
		//$this.append($('<iframe src="" id="responseFrame" name="responseFrame"></iframe>').css({"width":"0px", "height": "0px", "border": "0px"})));
		$this.append($('<div></div>')
			.attr("id", opts.upload.container)
			.append($('<form enctype="multipart/form-data" action="'+ opts.upload.url +'" method="post" name="frmUpload" id="frmUpload"></form>')
				.html(h)
				.append(
					$('<div></div>').addClass("uploadSetOptions").append(
					$('<select name="gallery_sets" id="gallery_sets"><option value="0">Select Set</option></select>'),
					$('<label>Add Set</label><input type="checkbox" name="add_set" id="add_set" />')),
					$('<div></div>').attr("id", "uploadAddSet").append(
					$('<label>Name:</label><input name="set_name" type="text" maxlength="20" />'),
					$('<label>Title:</label><input name="set_title" type="text" maxlength="55" />')),
					$('<div></div>').addClass("uploadMain").append(	
					$('<p></p>').addClass('uploadCaption').append(upC),	
					$('<input type="hidden" name="mode" value="' + opts.mode + '" />'),
					$('<input type="file" name="uploadFile" id="uploadFile" />'),
					$('<input type="submit" name="btnUpload" id="btnUpload" value="Upload" />'),
					$('<div></div>').attr("id", "uploadResponse"),
					$('<div></div>').attr("id", "throbber")))));
					//$('#btnUpload').click(function() {
						$('#frmUpload').ajaxForm({
  							dataType: 'json',
							iframe: true,
							beforeSubmit: function() {
            					$('#throbber').css("display", "block");
        					},
							success: checkMode
						});
					//});
					$('#add_set').change(function() {
						if (this.checked) {
							$('#uploadAddSet').show('slow');
						} else {
							$('#uploadAddSet').hide('slow');
						}
					});
		if (opts.upload.showOptions) {
			$(".uploadSetOptions", $this).css("display", "block");
			if (opts.gallery_sets_url) {
				getSets();
			}
		}
	};
	
	function getSets() {
		doAjax('GET', opts.gallery_sets_url, '', '', addSets);		
	};
	
	function addSets(result) {
		if (result.length > 0) {
			$.each(result, function(i, itm) {
				$('#gallery_sets').append('<option value="'+itm[opts.itemMap.set_id]+'">'+itm[opts.itemMap.set_name]+'</option>');
			});
			$('#gallery_sets').change(function() {
				var v = $('#gallery_sets').val();
				var d = (opts.gallery_data.query_string) ? $this.getQueryString(opts.gallery_data.query_string, v) : '';
				var u = (d) ? opts.gallery_data.url : opts.gallery_data.url + v; 
				doAjax('GET', u, d, showLoading, initGallery);
			});
		}
	};
	
	function checkMode(result) {
		$('#throbber').css("display", "none");
		if (opts.mode == 'uploadOnly') {
			$('#uploadResponse').css("display", "block");
			$('#uploadResponse').html(result.label);
		} else if (opts.mode == 'manage') {
			var aImage = new Array(result);
			$('#'+opts.thumb_container).append(createImageLink(aImage[0]));
		}
	};
	
	function createGallery() {
		if ((opts.onThumbClick.position) && (opts.mode == 'display')) {
			var lv = opts.onThumbClick.position;
			if ((lv == 'top') || (lv == 'left')) { 
				$this.append($('<div></div>').attr("id", opts.large_container));
			} 
		}
		var gal = $('<div></div>').attr("id", opts.gallery_container);
		if ((opts.nav) && ((opts.nav.position == 'T') || (opts.nav.position == 'TB'))) {
			$(gal).append(createNav('HL'));
		} else if ((opts.nav) && ((opts.nav.position == 'L') || (opts.nav.position == 'LR'))) {
			$(gal).append(createNav('VL'));
		}
		var th = $('<div></div>').attr("id", opts.thumb_container);
		if (opts.nav) {
			$(th).css("overflow", "hidden");
		}
		$(gal).append($(th));
		if ((opts.nav) && ((opts.nav.position == 'B') || (opts.nav.position == 'TB'))) {
			$(gal).append(createNav('HR'));
		} else if ((opts.nav) && ((opts.nav.position == 'R') || (opts.nav.position == 'LR'))) {
			$(gal).append(createNav('VR'));
		}
		$this.append($(gal));
		if ((opts.onThumbClick.position) && (opts.mode == 'display')) {
			var lv = opts.onThumbClick.position;
			if ((lv == 'bottom') || (lv == 'right')) {
				$this.append($('<div></div>').attr("id", opts.large_container));
			} 
		} 
		return true;
	};
	
	function createNav(type) {
		var div = $('<div></div>').addClass(opts.nav.container);
		$(div).append(createNavLink(type));
		//$this.append($(div));
		return $(div);
				
		//$("."+opts.nav.container).empty();
		//var pgs;
		//var ul = document.createElement('ul');
		//$(ul).append($('<li></li>').append(createPrevNextLink('Prev')));
		/*if (opts.nav.maxDisplay) {
			pgs = (numPages < opts.nav.maxDisplay) ? numPages : opts.nav.maxDisplay;
		}
		for (var i=1; i<=pgs; i++) {
			$(ul).append($('<li></li>').append(createNavLink(i)));
		}*/
		//$(ul).append($('<li></li>').append(createPrevNextLink('Next')));
		//$('.'+opts.nav.container).append($(ul));
	};
	
	function createNavLink(type) {
		var a = document.createElement('a');
		if (type == 'VL') {
			$(a).addClass(opts.nav.prev);
		} else if (type == 'VR') {
			$(a).addClass(opts.nav.next);
		} else if (type == 'HL') {
			$(a).addClass(opts.nav.prev);
		} else if (type == 'HR') {
			$(a).addClass(opts.nav.next);
		}
		/*var aH = $(a).css('height');
		console.log(aH);
		var cH = $("." + opts.nav.container).css('height');
		console.log(cH);
		var mt = (cH - aH)/2 + 'px';*/
		$(a)
			.attr("href", "#")
			.click(function() {
				if ((type == 'VR') || (type == 'HR')) {
					nextPage();	
				} else if ((type == 'VL') || (type == 'HL')) {
					prevPage();	
				}
			});
		
		return $(a);
	};
	
	function nextPage() {
		if (_pageNum<_numPages-1) {
			_pageNum++;
			showThumbs(_pageNum);
		}
	};
	//
	function prevPage() {
		if (_pageNum>0) {
			_pageNum--;
			showThumbs(_pageNum);
		}
	};
	
	function getGalleryData() {
		var d = (opts.gallery_data.query_string) ? getQueryString(opts.gallery_data.query_string) : '';
		var u = (d) ? opts.gallery_data.url : opts.gallery_data.url + getInitSetValue();
		doAjax('GET', u, d, showLoading, initGallery);		
	};
	
	function showLoading() {
		$('#'+opts.thumb_container).html('Loading...');
	};
	
	function getQueryString(data) {
		var str = '';
		var v = '';
		$.each(data, function(i, itm) {
			//for sets, the id of the string is sent as an extra param
			v = itm.value;
			if (itm.key) {
				if (arguments.length > 1) {	
					v = arguments[1];
				}
			}
			str += itm.name + "=" + v + "&";							
		});
		//remove last "&"
		str = str.substr(0, (str.length-1));
		return str;
	};
	
	function getInitSetValue() {
		return (opts.gallery_data.initSetId) ? opts.gallery_data.initSetId : '';
	};
	
	function doAjax(t, u, d, fnBefore, fnSuccess) {
		$.ajax({
			type: t,
			url: u,
			data: d,
			dataType: 'json',
			beforeSend: fnBefore, 
			//complete: function(){ $("#loading").hide("fast");}, //stop showing loading when the process is complete
			success: fnSuccess 
		 }); //close $.ajax(
	};
			
	function initGallery(data) {
		$('#throbber').css("display", "none");
		if ((data)) {
			if (opts.isMultiple) {
				doMultipleGalleries(data);
			} else {
				if (opts.mode == "display") {
					showCaption(data);
				}
				$('#'+opts.thumb_container).html('');
				createPages(data);
			}
		}
		//this.showPagination();
	};
	
	function showCaption(data) {
		if (opts.itemMap.set_title) {
			$("#galleryCaption").html('<h3>'+data[0][opts.itemMap.set_title]+'</h3>');
		}
	};
	
	function createPages(data) {
		var aPage = new Array();
		var pageNum = 0;
		totalImages = data.length;
		_numPages = Math.ceil(totalImages/opts.picsPerPage);
		var offset = 0;
		var imgCnt = 0;
		//
		$.each(data, function(i, itm) {
			aPage[offset] = itm;
			offset++;
			imgCnt++;
			if ((offset == opts.picsPerPage) || (imgCnt == totalImages)) {
				offset = 0;
				_pages[pageNum] = new $.imImageInfo(aPage);
				pageNum++;
				aPage = [];
			}
		});
	
		if (_pages.length) {
			showThumbs(0);
		}
	};
	
	function doMultipleGalleries(data) {
		totalGalleries = data.length;
		//get the first object from each group of galleries to create and then call createPages
		var jsonData = {};
		$.each(data, function(i, itm) {	
			galleries[i] = itm;
			jsonData[i] = itm[0];
		});
		createPages(jsonData);		
	};
	
	function showThumbs(nPage) {
		$('#'+opts.thumb_container).empty();
		var nL = _pages[nPage].image.length; //($this.images.length) ? opts.picsPerPage + $this.offset;
		for (var i = 0; i<nL; i++) {
			$('#'+opts.thumb_container).append(createImageLink(_pages[nPage].image[i]));
		}
		if (opts.mode == 'display') {
			if (opts.onThumbClick.position) {
				if (opts.onThumbClick.position == 'lightbox') {
					//$(function() {
						$('#'+opts.thumb_container+ ' a').lightBox({
															fixedNavigation:true,
															imageLoading: opts.lightbox_base_loc +	'images/lightbox-ico-loading.gif',
															imageBtnPrev: opts.lightbox_base_loc +	'images/lightbox-btn-prev.gif',
															imageBtnNext: opts.lightbox_base_loc +	'images/lightbox-btn-next.gif',	
															imageBtnClose: opts.lightbox_base_loc +	'images/lightbox-btn-close.gif',
															imageBlank:	opts.lightbox_base_loc + 'images/lightbox-blank.gif'
															});
					//});
				}
			}
			if (opts.onThumbClick.position) {
				if (opts.onThumbClick.position != 'lightbox') {
					showLargeImage(_pages[nPage].image[0]); 
				}
			}
		}
	};
	
	function createImageLink(aImage) {
	 	var _img = new Image();
		var nW = parseInt(aImage[opts.itemMap.thumb_width]);
		var nH = parseInt(aImage[opts.itemMap.thumb_height]);
		var loc = opts.base_path + aImage[opts.itemMap.thumb_name];	
		if ((nW) && (nH)) {
			if (opts.thumb_max_height) {
				var imgSize = getNewSize(nW, nH, opts.thumb_max_height);
			} else if (opts.thumb_max_width) {
				var imgSize = getNewSize(nH, nW, opts.thumb_max_width);
				imgSize.reverse();
			} else {
				var imgSize = new Array(nW, nH);	
			}
			$(_img).attr({ src: loc, alt: aImage[opts.itemMap.thumb_name], width: imgSize[0], height: imgSize[1]});
		} else {
			$(_img).attr({ src: loc, alt: aImage[opts.itemMap.thumb_name]})	
		}

		var iname = aImage[opts.itemMap.thumb_name];
		iname = iname.split('/');
		var id = iname[iname.length-1];	
		if (opts.mode == 'manage') {
			var div = $('<div></div>').addClass('manageThumb');
			$(div)
				.attr('id', id)
				.css({'background-image': 'url('+loc+')', width: imgSize[0], height: imgSize[1]});
			if (opts.delete_url) {	
				var del = $('<div></div>').addClass('thumbDelete');
				$(del).click(function() {
							confirmDelete(aImage[opts.itemMap.img_id], id);
							return false;
						});
				$(div).append($(del));
			}
			return $(div);
		} else {
			var a = document.createElement('a');
			if (opts.itemMap.title) {
				var ti = aImage[opts.itemMap.title];	
			} else {
				var ti = id;	
			}
			$(a).attr('title', ti).append($(_img));
			return getClickAction($(a), aImage);
		}
	};
	
	function createTextLink(aImage, tType, field) {
		if (tType.canClick) {
			var imgName = aImage[opts.itemMap.img_name];
			var regW = aImage[opts.itemMap.img_width];
			var regH = aImage[opts.itemMap.img_height];
			var a = document.createElement('a');
			$(a)
		 		.attr("href", "#")
		 		.append(aImage[field])
		 		.click(function() {
					clickLink(imgName, regW, regH);
					return false;
				});
			return $(a);
		} else {
			return document.createTextNode(aImage[field]);	
		}
	};
	
	// clickAction - used by both image and text link. you have the option of calling a function
	function getClickAction(a, aImage) {
		if (opts.onThumbClick.link) {
			if (opts.onThumbClick.link == 'fromData') {
				var ln = aImage[opts.itemMap.link];	
			} else {
				var ln = (opts.onThumbClick.param) ? opts.onThumbClick.link + id : opts.onThumbClick.link;
			}
			a.attr("href", ln);
		} else if (opts.onThumbClick.position) {
			if (opts.onThumbClick.position == 'lightbox') {
				a.attr("href", opts.base_path + aImage[opts.itemMap.img_name]);
			} else {
				a.attr("href", "#");
				a.click(function() {
					showLargeImage(aImage); 
					return false;
				});	
			}	
		} else if (opts.onThumbClick.func) {
			a.attr("href", "#");
			var fn = eval(opts.onThumbClick.func);
			if (opts.onThumbClick.param) {
				fn (aImage[opts.itemMap.img_id]);		
			} else {
				fn ();	
			}
		}
		return a;
	};
	
	function confirmDelete(dbId, elId) {
		var answer = confirm('Are you sure you want to delete this image?');
		if (answer) {
			_selectedThumb = elId;
			doAjax('GET', opts.delete_url + dbId, '', '', removeThumb);	
		}
	};
	
	function removeThumb(data) {
		// if (data
		$(_selectedThumb).remove();
	};
	
	function showLargeImage(aImage) {
		var lg = $("#"+opts.large_container);
		$(lg).empty();
		var loc = opts.base_path + aImage[opts.itemMap.img_name];
		var nW = parseInt(aImage[opts.itemMap.img_width]);
		var nH = parseInt(aImage[opts.itemMap.img_height]);
		var _img = new Image();
		if ((nW) && (nH)) {
			$(_img).attr({ src: loc, alt: aImage[opts.itemMap.img_name], width: nW, height: nH});
		} else {
			$(_img).attr({ src: loc, alt: aImage[opts.itemMap.img_name]})	
		}
		$(lg).append($(_img));
		$(lg).fadeIn("slow");//slideDown(1000);
	};
	
	function showNav() {
		$("."+opts.nav.container).empty();
		var pgs;
		var ul = document.createElement('ul');
		$(ul).append($('<li></li>').append(createPrevNextLink('Prev')));
		/*if (opts.nav.maxDisplay) {
			pgs = (numPages < opts.nav.maxDisplay) ? numPages : opts.nav.maxDisplay;
		}
		for (var i=1; i<=pgs; i++) {
			$(ul).append($('<li></li>').append(createNavLink(i)));
		}*/
		$(ul).append($('<li></li>').append(createPrevNextLink('Next')));
		$('.'+opts.nav.container).append($(ul));
	};
	
	function createPrevNextLink(text) {
		var a = document.createElement('a');
		$(a)
		//$('<a></a>')
			.attr("href", "#")
			.append(text)
			.click(function() {
				if (text == 'prev') {
					nextPage();	
				} else {
					prevPage();	
				}
			});
		
		return $(a);
	};
	
	function createNavLinkOld(pageNum) {
		var a = document.createElement('a');
		$(a)
		//$('<a></a>')
			.attr("href", "#")
			.append(pageNum)
			.click(function() {
				$(this).addClass('currentpage');
				selectedPage = $(this);
				if (pageNum == 'View All') {
				//	self.showThumbs('All');	
				//	self.showFirstLarge(self.aPages[0].image[0]);
				} else {
					showThumbs(pageNum-1);	
					showFirstLarge(aPages[pageNum-1].image[0]);
				}
			});
		
		return $(a);
	};
	
	function showFirstLarge(aImage) {
		var imgName = aImage.img_name;
		var regW = aImage.reg_width;
		var regH = aImage.reg_height
		loadLargeImage(imgName, regW, regH);
	};
	
	function getPageLink(pageNum) {
		var a = document.createElement('a');
		$(a)
			.attr("href", "#")
			.append(document.createTextNode(pageNum))
			.click(function() {
				$(this).css("color", "#CC6600");
				if (selectedPage != null) {
					selectedPage.css("color", "#fff");
				}
				selectedPage = $(this);
				if (pageNum == 'View All') {
				//	self.showThumbs('All');	
				//	self.showFirstLarge(self.aPages[0].image[0]);
				} else {
					showThumbs(pageNum-1);	
					showFirstLarge(aPages[pageNum-1].image[0]);
				}
				return false;
			});
		return $(a);
	};
	
	function adjustPhotoSize(nCurSize, nMaxSize) {
		var nPerc = (nCurSize > nMaxSize) ? nMaxSize/nCurSize : 1; 
		return nPerc;
	};

	function getNewSize(nW, nH, nMaxSize) {
		var imgSize = new Array();
		var nPerc = adjustPhotoSize(nH, nMaxSize);
		var newH = nH*nPerc;
		var newW = nW*nPerc;
		imgSize.push(newW, newH);
		return imgSize;
	};
};
$.imImageInfo = function(img) { 
	this.image = img;
};

$.imGallery.defaults = {
	mode: 'display',
	//uploadContainer: 'uploadContainer',
	//hidden_fields: '', //used for upload
	upload: '',
	uploadCaption: 'Click Browse to Select a File',
	delete_url: '',
	gallery_sets_url: '',
	gallery_sets_data: '',
	gallery_container: 'gallery', 
	//can use querystring or initSetId. initSetId is used on the public gallery page
	gallery_data: '',// {"url": "where.php", "query_string": [{name: "action", value: "doGetJson"}, {name: "page", value: "gallery_sets"}, {name: "set_id", value: "1", key: true}, set_id = 1 ], "initSetId": ''},
	thumb_container: "thumbContainer",
	onThumbClick: {'position': 'lightbox'},// {'link': "fromData"}, {'link': 'http//....'}, {'func': 'function', "param":true}, {'position': 'Left', 'Right', 'Top', 'Bottom', 'lightbox'}
	large_container: "largeContainer",
	lightbox_base_loc: "js/jquery/jquery-lightbox-0.5/",
	title: '',
	desc: '',
	nav:'', //T, TB, LR
	//form_id: '',
	isMultiple: false, //whether there are multiple galleries
	picsPerPage: '',
	base_path: '',
	file_types: 'jpg,png,gif',
	//upload_file: '',
	//upload_limit: 1,
	thumb_max_height: '',
	thumb_max_width: ''
};
/*$.imGallery.defaults = {
	//container: 'mainContent',
	mode: 'manage',
	//uploadContainer: 'uploadContainer',
	//hidden_fields: '', //used for upload
	upload: {"container": "uploadContainer", "url": "../includes/controllers/dbActionController.php", "showDescription": true, "hidden_fields": [ {name: "img_type", value: "P"}, {name: "action", value: "doAdd"}, {name: "page", value: "member_images"} ]},
	uploadHeader: 'Click Browse to Select a File',
	//thumbContainer: 'thumbContainer',
	//thumb_class: 'thumbs',
	//navContainer: 'navContainer',
	gallery: {"container": "gallery", "url": "../includes/controllers/dbActionController.php?action=doGetJson&page=venues&venue_id=7"}, 
	title: {"container": "titleContainer", "canClick": false, "func": "showLarge"} /text in the container can have it's own class
	thumbs: {"container": "thumbContainer", "image": "thumbs", "func": "showLarge", "max_height": 166}, //can optionally call your own function
	desc: {"container": "titleContainer", "canClick": false, "func": "showLarge"}
	nav: {"container": 'navContainer', "position": "bottom"}, //top, bottom, both
	//form_id: '',
	isMultiple: false, //whether there are multiple galleries
	picsPerPage: '',
	//thumb_loc: 'jPhotoGallerUpload/thumbs/',
	//large_loc: 'jPhotoGallerUpload/large/',
	file_types: 'jpg,png,gif',
	//upload_file: '',
	//gallery_data: '',
	//upload_limit: 1,
	//maxThumbHeight: 166,
	maximum: {"height": "166"}, // or {"width": "100"}
	//maxSize: 350000
	
};*/
})(jQuery);