var picArray = new Array();
var setArray = new Array();
var pic_sort_key = 'date_taken';
var default_image = 0;
var pageanate_by = 6
var page_lang = $("html").attr("lang");
var thumb_text = (page_lang == "en") ? "The most recente photos" : "Photos les plus récentes";
var img_title = (page_lang == "en") ? "See this photo on Flickr" : "Voir cet photo sur Flickr";
var slideshow_text = (page_lang == "en") ? "Slideshow" : "Diaporama";
var slideshow_url = ""


function create_page_nav(num_pages){
	if(num_pages > 1){
		pagelist = $("<ul/>").attr("id", "pagelist").attr("class", "clearfix");
		for(i=1; i<=num_pages; i++){
			$("<a/>").html(i).attr("href", "#").attr("id", "page_"+i).click(function(){view_thumb_page($(this).attr('id')); return false;}).appendTo(pagelist).wrap("<li></li>");
		}
		pagelist.appendTo("#flickr_thumbs")
	}
}
function switch_image(currentlink, new_src, new_desc, new_link, img_num){
//alert(data.items.length)
	//split_description = new_desc.split('<p>')
	//description_text = split_description[3].substr(0,split_description[3].length-4).replace(/"/, '\'');
	$("#flickr_desc").html(new_desc)
	$("#large_flickr_image").attr("src", new_src);
	$("#flickr_link").attr("href", new_link);
	$("#flickr_thumbs a").removeClass("active");
	$(currentlink).addClass("active");
	page_num = Math.ceil((parseFloat(img_num)+1)/pageanate_by)
//	alert(page_num)
	view_thumb_page("page_"+page_num);
}
function view_thumb_page(which){
	$("#flickr_thumbs #pagelist a").removeClass("active");
	$("#"+which).addClass("active");	
	hideItems = (parseFloat(which.replace(/page_/, ''))-1)*pageanate_by;
	$("#flickr_thumbs #scroller>div:lt("+hideItems+")").hide()
	$("#flickr_thumbs #scroller>div:eq("+hideItems+")").show()
	$("#flickr_thumbs #scroller>div:gt("+hideItems+")").show()
}

function custom_sort(a, b) {
	var y = a[pic_sort_key];
	var x = b[pic_sort_key];
	return ((x < y) ? -1 : ((x > y) ? 1 : 0));
} 
function prep_array(data){
	setArray[0] = new Object;
	setArray[0].title = data.title;
	setArray[0].link = data.link;
	setArray[0].description = data.description;
	setArray[0].modified = data.modified;
	
	$.each(data.items, function(i,item){
		picArray[i] = new Object;
  	picArray[i].title = item.title;
  	picArray[i].link = item.link;
  	picArray[i].media = item.media.m;
  	picArray[i].description = item.description;
  	picArray[i].date_taken = item.date_taken;
  	picArray[i].tags = item.tags;
		// order by pic_sort_key
		picArray.sort(custom_sort)
  });
	build_page()
}
function split_description(desc){
	split_desc = desc.split('<p>')
	if(split_desc[3]){
		desc = split_desc[3].substr(0,split_desc[3].length-4).replace(/"/, '\'');
	}else{
		desc = "&nbsp;";
	}
	lang_desc = desc.split('~')
	if(page_lang == "en"){
		desc = lang_desc[1] 
	}else{
		desc = lang_desc[0] 
	}
	return $.trim(desc);
}
/*************************************************************
<div id="flickr_zone" class="clearfix">
	<div id="flickr_main" class="clearfix"></div>
	<div id="flickr_thumbs" class="clearfix">
		<div id="thumb_title">Les photos les plus récente</div>
		<div id="scroller_zone" class="clearfix">
			<div id="scroller" class="clearfix"></div>
		</div>
	</div>
</div>
*************************************************************/
function build_page(){	
  num_pages = Math.ceil(picArray.length/pageanate_by)
	// create main picture zone
	$("#flickr_zone").empty()
	flickr_main = $("<div/>").attr("id", "flickr_main").attr("class", "clearfix");
	mainContainer = $("<div/>").attr("class", "photodiv clearfix").appendTo(flickr_main);
	mainInnerlink = $("<a/>").attr("id", "flickr_link").attr("title", img_title).attr("target", "_blank").appendTo(mainContainer);
	$("<img/>").attr("id", "large_flickr_image").appendTo(mainInnerlink);
	$("<div/>").attr("id", "flickr_desc").appendTo(mainContainer);
	flickr_main.appendTo("#flickr_zone");
	flickr_thumbs = $("<div/>").attr("id", "flickr_thumbs").attr("class", "clearfix");
	slideshow_link = $("<a/>").attr("id", "slideshow_link").attr("href", slideshow_url).attr("target", "_blank").html(slideshow_text).appendTo(flickr_thumbs);
	thumb_title = $("<div/>").attr("id", "thumb_title").html(thumb_text).appendTo(flickr_thumbs);
	scroller_zone = $("<div/>").attr("id", "scroller_zone").attr("class", "clearfix").appendTo(flickr_thumbs);
	scroller = $("<div/>").attr("id", "scroller").attr("class", "clearfix").appendTo(scroller_zone);
	flickr_thumbs.appendTo("#flickr_zone");
	create_page_nav(num_pages)
	// create thumbnails
	for(i=0; i<picArray.length ; i++){
		thmb_img_src = picArray[i].media.replace(/_m/, '_s');
		lrg_img_src = picArray[i].media.replace(/_m/, '');
		picArray[i].description = split_description(picArray[i].description);
		date_text = picArray[i].date_taken.substr(0,10)
		container = $("<div/>").attr("class", "photodiv clearfix").attr("id", "photo_"+i);
   	innerlink = $("<a/>").attr("rel", i).attr("href", "#").click(function(){switch_image($(this),picArray[$(this).attr("rel")].media.replace(/_m/, ''), picArray[$(this).attr("rel")].description, picArray[$(this).attr("rel")].link, $(this).attr("rel")); return false;});
    innerlink.appendTo(container);
    $("<img/>").attr("src", thmb_img_src).attr("width", 75).attr("height", 75).appendTo(innerlink);
    $("<div/>").html(date_text).appendTo(innerlink);
    container.appendTo("#flickr_thumbs #scroller");
	}
	switch_image($("#flickr_thumbs #scroller a:eq("+default_image+")"),picArray[default_image].media.replace(/_m/, ''), picArray[default_image].description, picArray[default_image].link, default_image);
}

function init_flickr(){
	var flickr_set = $("#flickr_set").attr("href");
	var set_pattern = /\/sets\/(.+)\/detail/;
	var matched_str = flickr_set.match(set_pattern);
	var flickr_set_id = matched_str[matched_str.length-1]
	slideshow_url = flickr_set.replace(/\/detail/, "/show");
	$.getJSON("http://api.flickr.com/services/feeds/photoset.gne?set="+flickr_set_id+"&nsid=37171092@N06&lang=en-us&format=json&jsoncallback=?", function(data){prep_array(data)})
}

$(function(){
	init_flickr();
})