/*	
 *	flinger.js
 *	ver 0.1
 *
 *	pulls any specified flickr gallery
 *	by RS, 09/2010
 *	
 */
 
 
//console.log('SCV good to go, sir!');


// --------------------------------------------------------
// assemble URL
 
var flickrUrl = 'http://api.flickr.com/services/feeds/photoset.gne';
flickrUrl += '?set=' + flickrPhotoSet;
flickrUrl += '&nsid=' + flickrNSID;
flickrUrl += '&lang=en-us';
flickrUrl += '&format=json';
flickrUrl += '&jsoncallback=?';

////console.log('FL: querying ' + flickrUrl);





// --------------------------------------------------------
// query url, handle callback

$.getJSON(flickrUrl, function(data) {



	//console.log('FL: JSON received');
	var framework = '';
	framework = '<div id="flickr-main">';
		framework += '<div id="flickr-photo"></div>';
		framework += '<div id="flickr-info"></div>';
	framework += '</div>';
	
	framework += '<div id="flickr-navigation">';
		framework += '<div id="flickr-thumbs"></div>';
		framework += '<div id="flickr-controls"></div>';
	framework += '</div>';
	
	$('#flinger').html(framework);

	var flickrSetName = data.title;
	var currentPhoto = Math.floor(Math.random()*6);
	
	
	// --------------------------------------------------------
	// get large image for currentPhoto
	
	var requiredPhotoSize = 'z';
				
	var img = new Image();
	img.src = data.items[currentPhoto].media.m.replace('_m.jpg', '_' + requiredPhotoSize + '.jpg');
				
	$('#flickr-photo').html('<img src="' + img.src + '">');
	if (img.width > img.height) {
		$('#flickr-photo').addClass('landscape');
	} else {
		$('#flickr-photo').addClass('portrait');
	}

	delete img;
	
	////console.log(data.items[currentPhoto]);
	
	
	// --------------------------------------------------------
	// populate info box with image title, comments, etc
	
	var currentPhotoInfo = '<h3>' + data.items[currentPhoto].title + '</h3>';
	currentPhotoInfo += data.items[currentPhoto].description;
	$('#flickr-info').html(currentPhotoInfo);
	$('#flickr-info p:eq(0)').remove();
	$('#flickr-info p:eq(0)').remove();
	
	/*
	var td = $(currentPhotoInfo);
	//console.log(td);
	//console.log(td[6].innerHTML);
	*/
	
	////console.log(data.items[currentPhoto].description);
	
	
	// --------------------------------------------------------
	// end handling flickr-main
	
	$('<div class="clear"></div>').appendTo('#flickr-main');
	
	
	// --------------------------------------------------------
	// print thumbnails and links
	
	var thumbOffset = 0;
	var thumbWidth = 70;
	var thumbGutterWidth = 5;
	var thumbDistance = thumbWidth + thumbGutterWidth;
	var scrollPageCount = 1;
	var scrollCurrentPage = 1;
	var scrollPageCountIncrement = 0;
	
	$('#flickr-thumbs').html('<div id="flickr-thumbs-scroller"></div>');

	$.each(data.items, function(i,item) {
	
		$('<img/>')
			.attr('src', item.media.m.replace('_m.jpg', '_s.jpg'))
			.appendTo('#flickr-thumbs-scroller')
			.wrap('<a class="flickr-thumb" id="flickr-thumb-' + i + '" title="' + item.title + '" style="left: ' + thumbOffset + 'px;" href="#"></a>');
			
		if (currentPhoto == i) {
			$('#flickr-thumb-' + i).addClass('active');
		}
			
		thumbOffset += thumbDistance;
		scrollPageCountIncrement++;
		if (scrollPageCountIncrement > 6) {
			scrollPageCount++;
			scrollPageCountIncrement = 0;
		}
		
		
	});	// each item
	
	////console.log('FL: ' + scrollPageCount + ' pages of photos');
	
	
	// --------------------------------------------------------
	// create "controls"
	
	// create prev, numeric and next links
	var scrollControls = '';
	scrollControls += '<a class="flickr-scroll-link" id="flickr-scroll-prev" href="#">&laquo;&laquo;</a>';
	scrollControls += '<span class="flickr-scroll-page-identifier">page</span>';
	for (i = 0; i < scrollPageCount; i++) { scrollControls += '<a class="flickr-page-link" id="flickr-scroll-page-' + (i + 1) + '" href="#">' + (i + 1) + '</a>'; }
	scrollControls += '<a class="flickr-scroll-link" id="flickr-scroll-next" href="#">&raquo;&raquo;</a>';
	
	// add these links to the display, make appropriate one active
	$(scrollControls).appendTo('#flickr-controls');
	if (scrollCurrentPage == 1) $('#flickr-scroll-prev').addClass('inactive');
	if (scrollPageCount == 1 || scrollCurrentPage == scrollPageCount) $('#flickr-scroll-next').addClass('inactive');
	$('#flickr-scroll-page-' + scrollCurrentPage).addClass('active');
	
	// view set on flickr link
	//$('<a class="flickr-linkback" href="' + data.link + '">Click to see more photos on Flickr &raquo;</a>').appendTo('#flickr-controls');
	
	// wrap up
	$('<div class="clear"></div>').appendTo('#flinger');
	
	
	
	// --------------------------------------------------------
	// enable thumbnail links
	
	$('.flickr-thumb').click(function() {
	
		var targetPhoto = parseInt(this.id.substr(13));
		//console.log('FL: show photo #' + targetPhoto);
		
		$('#flickr-photo').removeClass('landscape');
		$('#flickr-photo').removeClass('portrait');
		
		var img = new Image();
		img.src = data.items[targetPhoto].media.m.replace('_m.jpg', '_' + requiredPhotoSize + '.jpg');
		if (img.width > img.height) {
			$('#flickr-photo').addClass('landscape');
		} else {
			$('#flickr-photo').addClass('portrait');
		}
		
		$('#flickr-photo').html('<img src="' + img.src + '">');
		var targetPhotoInfo = '<h3>' + data.items[targetPhoto].title + '</h3>';
		targetPhotoInfo += data.items[targetPhoto].description;
		$('#flickr-info').html(targetPhotoInfo);
		$('#flickr-info p:eq(0)').remove();
		$('#flickr-info p:eq(0)').remove();
		
		$('.flickr-thumb').removeClass('active');
		currentPhoto = targetPhoto;
		$('#flickr-thumb-' + currentPhoto).addClass('active');
		
		delete img;
		return false;
	
	});
	
	
	
	// --------------------------------------------------------
	// enable scrolling links
	
	var scrollOffset = 0;
	var scrollContainerWidth = $('#flickr-thumbs').width();
	
	$('.flickr-scroll-link').click(function() {
		
		
		// show next photos
		
		if (this.id == 'flickr-scroll-next') {
		
		
			if (scrollCurrentPage < scrollPageCount) {
			
				scrollCurrentPage++; 
				
				//console.log('FL: showing next photos');
			
				$('#flickr-thumbs-scroller').animate({ 
						left: '-=' + (scrollContainerWidth + thumbGutterWidth) 
					}, 
					400, 
					function() { 
						scrollOffset -= (scrollContainerWidth + thumbGutterWidth); 
						//console.log('FL: offset now ' + scrollOffset);
						$('.flickr-page-link').removeClass('active');
						$('#flickr-scroll-page-' + scrollCurrentPage).addClass('active');
					});
					
								
			} else { 
				//console.log('FL: no more "next" photos to show!'); 
			}
			
			
		} else if (this.id == 'flickr-scroll-prev') {
		
		
			if (scrollCurrentPage > 1) {
			
				scrollCurrentPage--; 
		
				//console.log('FL: scrolling previous photos');
				
				$('#flickr-thumbs-scroller').animate({ 
						left: '+=' + (scrollContainerWidth + thumbGutterWidth) 
					}, 
					400, 
					function() { 
						scrollOffset += (scrollContainerWidth + thumbGutterWidth); 
						//console.log('FL: offset now ' + scrollOffset);
						$('.flickr-page-link').removeClass('active');
						$('#flickr-scroll-page-' + scrollCurrentPage).addClass('active');
					});
					
			
			} else { 
				//console.log('FL: no more "prev" photos to show!'); 
			}
		
		
		}	// if prev or next link
		
		//console.log('FL: currentPage now ' + scrollCurrentPage);
		$('.flickr-scroll-link').removeClass('inactive');
		if (scrollCurrentPage == 1) $('#flickr-scroll-prev').addClass('inactive');
		if (scrollPageCount == 1 || scrollCurrentPage == scrollPageCount) $('#flickr-scroll-next').addClass('inactive');
		
		// make sure anchor is not enabled
		return false;
	
	});	// scroll link action
	
	
	$('.flickr-page-link').click(function() {
		
		var scrollTargetPage = parseInt(this.id.substr(19));
		//console.log('FL: scroll to page ' + scrollTargetPage);
		
		if (scrollTargetPage != scrollCurrentPage && (scrollTargetPage > 0 && scrollTargetPage <= scrollPageCount)) {
		
			newScrollOffset = (-1) * (scrollTargetPage - 1) * ( scrollContainerWidth + thumbGutterWidth);
			//console.log('FL: target offset: ' + newScrollOffset);
			
			scrollCurrentPage = scrollTargetPage;
			
			$('#flickr-thumbs-scroller').animate({
					left: newScrollOffset + 'px'
				},
				400,
				function() {
					scrollOffSet = newScrollOffset;
					//console.log('FL: scrolled to page ' + scrollCurrentPage + ' at offset ' + scrollOffset);
					$('.flickr-page-link').removeClass('active');
					$('#flickr-scroll-page-' + scrollCurrentPage).addClass('active');
				});
			
					
		} else { 
			//console.log('FL: invalid page number'); 
		}
		
		$('.flickr-scroll-link').removeClass('inactive');
		if (scrollCurrentPage == 1) $('#flickr-scroll-prev').addClass('inactive');
		if (scrollPageCount == 1 || scrollCurrentPage == scrollPageCount) $('#flickr-scroll-next').addClass('inactive');
		
		return false;
	
	});	// page link action




});	// work with JSON callback data
