
// use the widget div as the ui-dialog
Gallery.containerDivSel = ".radius-widget.radius-widget-gallery";

if (typeof LightboxGlobals === "undefined") {
	var LightboxGlobals = {};
}

LightboxGlobals.viewLightboxBtnSel = "a.load_lightbox";

var fnSetupGallery = function () {
	// Initially set opacity on thumbs and add
	// additional styling for hover effect on thumbs
	var onMouseOutOpacity = 0.67;
	
	$('.radius-widget.radius-widget-XX.widget-gallery-thumbnails').find('ul.thumbs li').opacityrollover({
		mouseOutOpacity:   onMouseOutOpacity,
		mouseOverOpacity:  1.0,
		fadeSpeed:         'fast',
		exemptionSelector: '.selected'
	});
	
	var gallery = $('.radius-widget-XX.widget-gallery-thumbnails').galleriffic({
		delay:                     3000, // in milliseconds
		numThumbs:                 maxThumbs, // The number of thumbnails to show page
		preloadAhead:              0, // Set to -1 to preload all images
		enableTopPager:            false,
		enableBottomPager:         false,
		maxPagesToShow:            9,  // The maximum number of pages to display in either the top or bottom pager
		imageContainerSel:         '#slideshow', // The CSS selector for the element within which the main slideshow image should be rendered
		controlsContainerSel:      '#controls', // The CSS selector for the element within which the slideshow controls should be rendered
		captionContainerSel:       '#caption', // The CSS selector for the element within which the captions should be rendered
		loadingContainerSel:       '#loading', // The CSS selector for the element within which should be shown when an image is loading
		renderSSControls:          true, // Specifies whether the slideshow's Play and Pause links should be rendered
		renderNavControls:         true, // Specifies whether the slideshow's Next and Previous links should be rendered
		playLinkText:              'Play',
		pauseLinkText:             'Pause',
		prevLinkText:              'Previous',
		nextLinkText:              'Next',
		nextPageLinkText:          'Next &rsaquo;',
		prevPageLinkText:          '&lsaquo; Prev',
		enableHistory:             false, // Specifies whether the url's hash and the browser's history cache should update when the current slideshow image changes
		enableKeyboardNavigation:  false, // Specifies whether keyboard navigation is enabled
		autoStart:                 false, // Specifies whether the slideshow should be playing or paused when the page first loads
		syncTransitions:           false, // Specifies whether the out and in transitions occur simultaneously or distinctly
		defaultTransitionDuration: 1000, // If using the default transitions, specifies the duration of the transitions
		onSlideChange:             undefined, // accepts a delegate like such: function(prevIndex, nextIndex) { ... }
		onTransitionOut:           undefined, // accepts a delegate like such: function(slide, caption, isSync, callback) { ... }
		onTransitionIn:            undefined, // accepts a delegate like such: function(slide, caption, isSync) { ... }
		onPageTransitionOut:       undefined, // accepts a delegate like such: function(callback) { ... }
		onPageTransitionIn:        undefined, // accepts a delegate like such: function() { ... }
		onImageAdded:              undefined, // accepts a delegate like such: function(imageData, $li) { ... }
		onImageRemoved:            undefined  // accepts a delegate like such: function(imageData, $li) { ... }
		});
/*
			onPageTransitionIn:        function() {
			var prevPageLink = this.find('a.prev').css('visibility', 'hidden');
			var nextPageLink = this.find('a.next').css('visibility', 'hidden');
			
			// Show appropriate next / prev page links
			if (this.displayedPage > 0) {
				prevPageLink.css('visibility', 'visible');
			}

			var lastPage = this.getNumPages() - 1;
			if (this.displayedPage < lastPage) {
				nextPageLink.css('visibility', 'visible');
			}

			this.fadeTo('fast', 1.0);
		}, // accepts a delegate like such: function() { ... }
*/
	gallery.find('a.prev').click(function(e) {
		gallery.previousPage();
		e.preventDefault();
	});
	
	gallery.find('a.next').click(function(e) {
		gallery.nextPage();
		e.preventDefault();
	});
	
	return gallery;

	// $.historyInit(Gallery.onHashChange);
};

$(document).ready(function () {
	if (typeof $.historyInit !== "undefined") {
		// @todo history appears broken when visiting a page with a
		//       #gallery-image-XXX-YYY hash without the if
		$.historyInit(Gallery.onHashChange);
	}
	
	//Check to see if gallerific has been loaded
	(function () {
		if (typeof $.galleriffic === "undefined") {
			var styles = ['/templates/default/gallery/css/gallery.css'];
			
			var scripts = [	'/components/jquery/jquery.galleriffic-2.0.1.js',
							'/components/jquery/jquery.history-20091014.js',
							'/components/jquery/jquery.opacityrollover-2.0.1.js',
							'/components/jquery/jquery.form.js',
//							'/components/jquery/jquery.validate.min.js',                 Causes all kinds of errors, is referenced elsewhere, therefore commenting this out
							'/components/jquery/jquery.fadeSlide.min.js',
							'/templates/default/js/Login.js'
							];
	
			for (var x = 0; x < styles.length; x++) {
				var style = document.createElement('link');
				style.href = styles[x];
				style.type = 'text/css';
				// append script to the head (or the body if no head exists)
				document.documentElement.firstChild.appendChild(style);
			}
			
			for (x = 0; x < scripts.length; x++) {
				var script = document.createElement('script');
				script.src = scripts[x];
				// append script to the head (or the body if no head exists)
				document.documentElement.firstChild.appendChild(script);
			}

			var fnCheckLoaded = function () {
				if (typeof $.galleriffic !== "undefined") {
					fnSetupGallery();
				} else {
					setTimeout(fnCheckLoaded, 20);
				}
			};
			
			setTimeout(fnCheckLoaded, 20);
		} else {
			fnSetupGallery();
		}
	})();

	$('.radius-widget.radius-widget-gallery').dialog({
		title: '',
		modal: true,
		autoOpen: false,
		width: 960,
		height: 700,
		dialogClass: 'itr_cms image_gallery',
		resizable: false,
		draggable: false
	}).draggable( 'disable' );

	// set up the onclick handler on the thumbnails to bring up the gallery
	var loadGallery = function () {
		// pop up the dialog box
		$('.radius-widget-gallery')
			.html('<div class="loading_box"><img class="loading_animation" src="/_media/gallery/WaitingAnimation.gif" width="80" height="80" alt="" />&nbsp;&nbsp;Loading...</div>')
			.dialog('open');
		
		//Get the picture id from the anchor's href attribute 
		var href = $(this).attr('href');
		var imgId = href.substr(1);
		
		// fetch the template content
		$.ajax({
			type:	"GET",
			url:	"/_modules/gallery.php?action=displaycollection&pic=" + imgId,
			data:	"ajax=1",
			success: Gallery.onLoadGallery
		});

		return false;
	};
	
	if (!bindingCustomClickHandler) {
		// Bind the default function (which loads the gallery) if a custom
		// handler won't be bound to the thumbnail images' click event
		$('.widget-gallery-thumbnails ul.thumbs a.thumb').click(loadGallery);
	} else {
		// Attach the designs page click handler if necessary
		// (Does nothing if loaded from anywhere else)
		var colorboxSource = function () {
			var img = $(this).find('img');
			var imgHref = $(img).attr('src').replace("\/thumbnails", "");
			var imgTitle = $(img).attr('alt');
			return '<img src="' + imgHref + '" alt="' + imgTitle + '" />';
		};
		
		$('.designs_page ul.thumbs a.thumb').colorbox({transition:'elastic', opacity:'0.5', html:colorboxSource});
	}

	// Handler for the "View My Lightbox" button. The selector should always
	// refer to exactly one link (otherwise, in situations where the gallery
	// is open and has such a link as well, it may effectively be clicked more
	// than once each time)
	$(LightboxGlobals.viewLightboxBtnSel).click(fnLoadLightbox);
});

