//javascript


(function($){
	//flickr plugin
	$.fn.flickrGallery = function(options) {
		
		var galleryFrame = this;
				
		//set up gallery structure
		galleryFrame.append('<div class="thumbnails"><div class="track"></div></div>');
		galleryFrame.append('<div class="main-image" />');
		
		var thumbnails = $('.thumbnails', this);
		var thumbnailsTrack = $('.thumbnails .track', this);
		var mainImg = $('.main-image', this);
		
		//add thumbnail navigation & paging
		thumbnails.prepend('<div class="gallery-nav prev unbound" />');
		thumbnails.append('<div class="gallery-nav next" />');
		
		//get json object
		$.getJSON('http://api.flickr.com/services/feeds/photos_public.gne?id=' + options.id +'&tags=' + options.tag + '&lang=en-us&format=json&jsoncallback=?', galleryFunction);
 		
 		
 		//add json data to gallery
 		function galleryFunction(data) {
 			
			//add thumbnail images
			$.each(data.items, function(key, item){
				var imgSrc = (item.media.m).replace('_m.jpg','_s.jpg');
				thumbnailsTrack.append('<a href=""><img src="' + imgSrc + '" class="thumb" /></a>');
			});
			
			//add initial main image
			$.each(data.items, function(key, item){
				var imgSrc = (item.media.m).replace('_m.jpg','_z.jpg');
				mainImg.append('<img src="' + imgSrc + '" />');
			});
						
			
			//a bunch of vars
			var thumbnailNum = $('.thumbnails a img').length;
			var thumbnailWidth = $('a', thumbnails).outerWidth(true);
			var thumbnailsTrackWidth = thumbnailNum * thumbnailWidth;
			var thumbnailsViewWidth = thumbnails.width();
			var thumbnailsViewNum = Math.floor(thumbnailsViewWidth / thumbnailWidth);
			var aniLength = thumbnailsViewNum * thumbnailWidth;
			var startPosLeft = $('.flickr-gallery .prev').width();
			var maxPosLeft = -(thumbnailsTrackWidth - aniLength) + 50;
			var posLeft = startPosLeft;
			var galleryNav = $('.flickr-gallery .gallery-nav');
			var mainImgContainerWidth = mainImg.width();
			
			//main image stuff
			var maxImgHeight = null;
			function flickrImgSize(opt) {
				opt.width('auto');
				var imgWidth = opt.width();
				var imgHeight = opt.height();
				var marginLeft = Math.ceil(-imgWidth / 2);
				var marginTop = Math.ceil(-imgHeight / 2) - 15;
				if(imgWidth >= (mainImgContainerWidth - 20)){
					opt.width(mainImgContainerWidth - 20);
					imgWidth = opt.width();
					imgHeight = opt.height();
					marginLeft = Math.ceil(-imgWidth / 2);
					marginTop = Math.ceil(-imgHeight / 2) - 15;
				}
				opt.css({
					'marginLeft': marginLeft,
					'marginTop': marginTop
				});
				
				if(maxImgHeight < imgHeight){
					maxImgHeight = imgHeight
				}
				console.log(imgWidth);
				mainImg.height(maxImgHeight);
 			} 			
 			
 			
 			
 			$('img', mainImg).one('load', function(){ flickrImgSize($(this)); });
 			
 			
 			$('img:eq(0)', mainImg).load(function(){ $(this).addClass('active'); });
 						
			//reset some vars on window resize
			$(window).resize(function(){
			
				thumbnailsViewWidth = thumbnails.width();
				thumbnailsViewNum = Math.floor(thumbnailsViewWidth / thumbnailWidth);
				aniLength = thumbnailsViewNum * thumbnailWidth;
				maxPosLeft = -(thumbnailsTrackWidth - aniLength) + 50;
				mainImgContainerWidth = mainImg.width();
				posLeft = $('.thumbnails .track').position().left;
				maxImgHeight = null;
								
				if(posLeft > maxPosLeft){
					$('.flickr-gallery .next').removeClass('unbound');
				} else if(posLeft <= maxPosLeft){
					$('.flickr-gallery .next').addClass('unbound');
				}
				
				$('img', mainImg).each(function(){ flickrImgSize($(this)); });
				
			});
			
			//set width of thumbnail track
			thumbnailsTrack.width(thumbnailsTrackWidth);
			
			//prev next functionality
			galleryNav.click(function(){
				if(($(this).hasClass('next')) && (posLeft > maxPosLeft) && !thumbnailsTrack.is(':animated')){
					thumbnailsTrack.animate({
						'left' : '-=' + aniLength
					}, 500, 'swing', function(){
						posLeft = thumbnailsTrack.position().left;
						if(posLeft < startPosLeft){
							$('.flickr-gallery .prev').removeClass('unbound');
						}
						if(posLeft <= maxPosLeft){
							$('.flickr-gallery .next').addClass('unbound');
						}
					});
				}
				if(($(this).hasClass('prev')) && (posLeft <= startPosLeft) && !thumbnailsTrack.is(':animated')){
					if(Math.abs(posLeft) < aniLength){
						thumbnailsTrack.animate({
							'left' : startPosLeft
						}, 500, 'swing', function(){
							posLeft = thumbnailsTrack.position().left;
							if(posLeft >= startPosLeft){
								$('.flickr-gallery .prev').addClass('unbound');
							}
							if(posLeft > maxPosLeft){
								$('.flickr-gallery .next').removeClass('unbound');
							}
						});
					} else {
						thumbnailsTrack.animate({
							'left' : '+=' + aniLength
						}, 500, 'swing', function(){
							posLeft = thumbnailsTrack.position().left;
							if(posLeft >= startPosLeft){
								$('.flickr-gallery .prev').addClass('unbound');
							}
							if(posLeft > maxPosLeft){
								$('.flickr-gallery .next').removeClass('unbound');
							}
						});
					}
				}
			});
			
			
 			
 			//make the gallery work.
 			$('a', thumbnails).click(function(){
 				var imgSrc = $('img', this).attr('src');
 				var mainImgSrc = imgSrc.replace('_s.jpg','_z.jpg');
 				$('.active', mainImg).removeClass('active');
 				$('img[src="' + mainImgSrc + '"]', mainImg).addClass('active');
 				return false;
 			});
 			
 		} //end galleryFunction
			
				
	} //end flickrGallery
	
	
})(jQuery);


//document ready
$(function(){

	
	//fitvids
	$('.whatsnew').fitVids();

	
	
	////////////////////////////////////////////////////
	//				upcoming events slider            //
 	////////////////////////////////////////////////////
 	
 	//slider entry set up
 	
 	$.ajax({
 		url: '../xml/gallery.xml', //change this when live !!!!!!!!!!!!!!!!!!!!!!!!!!
 		dataType: 'xml',
 		success: parseXML
 	});
 	
 	
 	function parseXML(xml){
 		var sliderEntries = '';
 		$(xml).find('item').each(function(){
 			sliderEntries += '<li>';
 			sliderEntries += '<a href="' + $(this).attr('link') + '">';
 			sliderEntries += '<img src="' + $(this).attr('src') + '" /><span class="border top"></span><span class="border right"></span><span class="border bottom"></span><span class="border left"></span>';
 			sliderEntries += '</a>';
 			sliderEntries += '<span class="event">' + $(this).find('title').text() + '</span>';
 			sliderEntries += '<span class="date">' + $(this).find('description').text() + '</span>';
 			sliderEntries += '</li>';
 		});
 		$('#upcoming-slider .slider').html(sliderEntries);
 		eventSlider();
 	}
 	
 	//slider animation & navigation
	function eventSlider() {
			
		$(window).load(function(){

			var sliderEntryWidth = $('#upcoming-slider .slider li').outerWidth() + 11;
			var sliderEntries = $('#upcoming-slider .slider li').length;
			var sliderWindowWidth = $('#upcoming-slider .upcoming-slider-wrap').width();
			var sliderWidth = sliderEntryWidth * sliderEntries;
			var visSliderEntries = Math.floor((sliderWindowWidth + 11) / sliderEntryWidth);
			var sliderPanels = Math.ceil(sliderEntries / visSliderEntries);
			var aniLength = sliderEntryWidth * visSliderEntries;
			var maxPosLeft = -(aniLength * (sliderPanels - 1));
			var posLeft = 0;
			
			$(window).resize(function(){
				sliderWindowWidth = $('#upcoming-slider .upcoming-slider-wrap').width();
				sliderWidth = sliderEntryWidth * sliderEntries;
				visSliderEntries = Math.floor((sliderWindowWidth + 11) / sliderEntryWidth);
				sliderPanels = Math.ceil(sliderEntries / visSliderEntries);
				aniLength = sliderEntryWidth * visSliderEntries;
				maxPosLeft = -(aniLength * (sliderPanels - 1));
			});
			
				
			$('#upcoming-slider .slider').width(sliderWidth);
			
			//add unbound class to prev button by default
			$('#upcoming-slider .prev').addClass('unbound');
			
			//hide arrows if entries smaller than window
			if (posLeft > maxPosLeft){
				$('#upcoming-slider .slider-nav').show();
			}
			
			//hover event effect
			$('#upcoming-slider .slider li a').hover(function(){
				if(!$('.border', this).is(':animated')){
					$('.border', this).fadeIn(200);
				}
			}, function(){
				$('.border', this).fadeOut(200);
			});
			
			//autoplay animation
			function autoPlay() {
				var autoPlay = setInterval(function(){
					if (posLeft > maxPosLeft){
						$('#upcoming-slider .slider').animate({
							'left' : '-=' + aniLength
						}, 500, "swing", function(){
							posLeft = $('#upcoming-slider .slider').position().left;
							if(posLeft <= maxPosLeft){
								$('#upcoming-slider .next').addClass('unbound');
							}
							if(posLeft < 0){
								$('#upcoming-slider .prev').removeClass('unbound');
							}
						});
					}
					if(posLeft <= maxPosLeft){
						$('#upcoming-slider .slider').animate({
							'left' : '0'
						}, 1000, "swing", function(){
							posLeft = $('#upcoming-slider .slider').position().left;
							$('#upcoming-slider .next').removeClass('unbound');
							$('#upcoming-slider .prev').addClass('unbound');
						});
					}
				}, 8000);
				$('#upcoming-slider .slider-nav').click(function(){
					clearInterval(autoPlay);
				});
			}
			autoPlay();
			
			//click to advance slider
			$('#upcoming-slider .slider-nav').click(function(){
				if(($(this).hasClass('next')) && (!$('.slider').is(':animated')) && (posLeft > maxPosLeft)){
					$('#upcoming-slider .slider').animate({
						'left' : '-=' + aniLength
					}, 500, "swing", function(){
						posLeft = $('#upcoming-slider .slider').position().left;
						if(posLeft <= maxPosLeft){
							$('#upcoming-slider .next').addClass('unbound');
						}
						if(posLeft < 0){
							$('#upcoming-slider .prev').removeClass('unbound');
						}
					});
					
				}
				if(($(this).hasClass('prev')) && (!$('.slider').is(':animated')) && (posLeft <= 0)) {
					if(Math.abs(posLeft) < aniLength){
						$('#upcoming-slider .slider').animate({
							'left' : 0
						}, 500, "swing", function(){
							posLeft = $('#upcoming-slider .slider').position().left;
							if(posLeft >= 0){
								$('#upcoming-slider .prev').addClass('unbound');
							}
							if(posLeft > maxPosLeft){
								$('#upcoming-slider .next').removeClass('unbound');
							}
						});
					} else {
						$('#upcoming-slider .slider').animate({
							'left' : '+=' + aniLength
						}, 500, "swing", function(){
							posLeft = $('#upcoming-slider .slider').position().left;
							if(posLeft >= 0){
								$('#upcoming-slider .prev').addClass('unbound');
							}
							if(posLeft > maxPosLeft){
								$('#upcoming-slider .next').removeClass('unbound');
							}
						});
					}
				}
				autoPlay(); // reset autoplay when clicked
			});
		
		});	
		
	}
	
	
	

});

$(window).load(function(){
	
	//img width 100% if larger than content area
	// function imageResize() {
// 		var contentWidth = $('#content').width() - 30;
// 		$('#content .main img:not(.thumb)').each(function(){
// 			var imgWidth = $(this).width();
// 			if(imgWidth >= contentWidth){
// 				$(this).width('100%');
// 			} else {
// 				$(this).width('auto');
// 			}
// 		});
// 		
// 	}
// 	imageResize();
// 	$(window).resize(function(){
// 		imageResize();
// 	});
	
	//flickr galleries
	$('#front-green-gallery').flickrGallery({
		id: '44592048@N05',
		tag: 'frontlawnsculptures'
	});
	
	$('#clifton-school-alumni-gallery').flickrGallery({
		id: '44592048@N05',
		tag: 'cliftonschoolalumni'
	});
	
});