/* 
VERSION AND LICENSE
---------------------------------------------------------------------------------------------
 *  FlickrBox, Friday, November 24, 2006, version 1.0
 *  (c) 2006 Naggle | Rich Hayler <rmhayler@hotmail.com>
 *  FlickrBox is freely distributable under the terms of an MIT-style license.
 *  For details, see the Naggle web site: http://www.naggle.com/
 
---------------------------------------------------------------------------------------------
 DESCRIPTION
---------------------------------------------------------------------------------------------
	
	FlickrBox is a CSS / PHP / JavaScript based Flickr Photo gallery that lets you display
	your recent Flickr photos and public photosets right on your own site using the Flickr
	API. One of the key differences between his script and others like it is that you can
	view the full sized image from within your own website without having to navigate to 
	Flickr.
	
---------------------------------------------------------------------------------------------
 CONFIGURATION
---------------------------------------------------------------------------------------------
 - To use FlickrBox please refeence the full article on Naggle.com
   http://www.naggle.com/index.php?/articles/comments/flickrbox/
	
---------------------------------------------------------------------------------------------
*/

function c_flickr(classname)
{
	this.page=1;
	this.pagination_id="set_pagination";
	this.description_id="";
	this.name=classname;
	this.data=null;
	
	this.recalc = function()
	{
		this.start=this.page*this.per_page-this.per_page;
		this.finish=(this.page*this.per_page>this.data.length) ? this.data.length : this.page*this.per_page;
		this.n_pages=Math.ceil(this.data.length/this.per_page);
	}

	this.show = function()
	{
		this.recalc();
	}
	
	this.make_pagination_ul = function()
	{
		var p_ul=document.getElementById(this.pagination_id);
		p_ul.className="pagination";
		if (this.n_pages>1)
		{
			var p_li=document.createElement("li");
			p_li.className='previouspage';
			
			var prev_img=document.createElement("img");
			prev_img.src="images/blank.gif";
			prev_img.width=nav_img_width;
			prev_img.height=nav_img_height;
			prev_img.alt='previous';
			prev_img.title='previous';
			
			var next_img=document.createElement("img");
			next_img.src="images/blank.gif";
			next_img.width=nav_img_width;
			next_img.height=nav_img_height;
			next_img.alt='next';
			next_img.title='next';
			
			if (this.page>1)
			{
				var p_a = document.createElement("a");
				p_a.href="#";
				p_a.onclick = new Function(this.name+".page="+(this.page-1)+"; "+this.name+".show(); return false;");
				p_a.appendChild(prev_img);
				p_li.appendChild(p_a);
			}
			else
			{
				p_li.appendChild(prev_img);
			}
			p_ul.appendChild(p_li);
			
			begin=this.page-Math.ceil(max_pages_on_screen/2)+1;
			end=this.page+Math.ceil(max_pages_on_screen/2)-1;
			if (end<max_pages_on_screen) end=max_pages_on_screen;
			if (end>this.n_pages)
			{
			 	end = this.n_pages;
				begin = end - max_pages_on_screen+1;
			}
			if (begin<1) begin = 1;
			
			for (i=begin; i<=end; i++)
			{
				var p_li=document.createElement("li");
				if (this.page!=i)
				{
					var p_a = document.createElement("a");
					p_a.href="#";
					p_a.onclick = new Function(this.name+".page="+i+"; "+this.name+".show(); return false;");
					p_a.appendChild(document.createTextNode(i));
					p_li.appendChild(p_a);
				}
				else
				{
					p_li.className='currentpage';
					p_li.appendChild(document.createTextNode(i));
				}
				p_ul.appendChild(p_li);
			}
			var p_li=document.createElement("li");
			p_li.className='nextpage';
			if (this.page<this.n_pages)
			{
				var p_a = document.createElement("a");
				p_a.href="#";
				p_a.onclick = new Function(this.name+".page="+(this.page+1)+"; "+this.name+".show(); return false;");
				p_a.appendChild(next_img);
				p_li.appendChild(p_a);
			}
			else
			{
				p_li.appendChild(next_img);
			}
			p_ul.appendChild(p_li);
		}
		else
		{
			var p_li=document.createElement("li");
			p_li.innerHTML='&nbsp;';
			p_ul.appendChild(p_li);
		}
	}
	
	this.pagination = function()
	{
		this.make_pagination_ul();
		
		switch(this.name)
		{
			case 'sets': 
				document.getElementById('total_photos_link').style.display='none';
			break;
			case 'fullSet': 
				document.getElementById('total_photos_link').style.display='none';
			break;
			case 'photos': 
				document.getElementById('total_fullSet_link').style.display='none';
			break;
		}
		
		document.getElementById('total_'+this.name+'_link').style.display='inline';
		var total = document.getElementById('total_'+this.name);
		total.innerHTML=this.data.length;
		if (this.n_pages<=1)
		{
			document.getElementById('total_'+this.name+'_link').style.display='none';
		}
	}
	
	this.show_all_pages = function()
	{
		old=this.per_page;
		this.per_page=this.data.length;
		this.page=1;
		this.show();
		this.per_page=old;
		document.getElementById('total_'+this.name+'_link').style.display='none';
	}
}


function c_sets(classname)
{
	this.photo_class;

	this.show = function()
	{
		this.recalc();
		var div=document.getElementById("flickrset");
		var old_p=document.getElementById(this.pagination_id);
		if (old_p!=null)
			div.removeChild(old_p);
		var old_ul=document.getElementById("flickrlist");
		if (old_ul!=null)
			div.removeChild(old_ul);
		var ul=document.createElement("ul");
		ul.className='flickrlist';
		ul.id='flickrlist';
		
		for (j=this.start; j<this.finish; j++)
		{
			var li=document.createElement("li");
			var a = document.createElement("a");
			a.href='#';
			a.appendChild(document.createTextNode(this.data[j].set_title));
			a.onmouseover	= new Function(this.name+".showDescription("+j+")");
			a.onmouseout	= new Function(this.name+".hideDescription()");
			a.onclick		= new Function(this.name+".showPhotos("+j+"); return false;");
			li.appendChild(a);
			ul.appendChild(li);
		}	
		div.appendChild(ul);
		var p_div=document.createElement("ul");
		p_div.id=this.pagination_id;
		div.appendChild(p_div);
		this.pagination();
	}
	
	this.showDescription = function (id)
	{
		var setDiv=document.getElementById(this.description_id);
		oldContent=setDiv.innerHTML;
		setDiv.innerHTML="<h2>"+this.data[id].set_title+"</h2>";
		setDiv.innerHTML+="<p>"+this.data[id].description+"</p>";
	}
	
	this.showCustomDescription = function (title, description)
	{
		var setDiv=document.getElementById(this.description_id);
		oldContent=setDiv.innerHTML;
		setDiv.innerHTML="<h2>"+title+"</h2>";
		setDiv.innerHTML+="<p>"+description+"</p>";
	}
	
	this.hideDescription = function ()
	{
		setDiv=document.getElementById(this.description_id);
		setDiv.innerHTML=oldContent;
	}
	
	this.showPhotos = function (set_id)
	{
		this.showDescription(set_id);
		photos.data=setRec[set_id].photos;
		photos.page=1;
		photos.show();
	}
	
	this.showFullSet = function ()
	{
		fullSet.data=setRec;
		fullSet.per_page=n_photos_per_page;
		fullSet.page=1;
		fullSet.show();
	}
	
	this.initFirstPage = function ()
	{
		this.show();
		photos.data=Recent;
		photos.show();
		var setDiv=document.getElementById(this.description_id);
		oldContent=setDiv.innerHTML;
		setDiv.innerHTML="<h2>"+initial_title+"</h2>";
		setDiv.innerHTML+="<p>"+initial_description+"</p>";
	}
}

	
function c_photos()
{
	this.show = function()
		{
		this.recalc();
		var div=document.getElementById("flickrbox");
		var old_p=document.getElementById(this.pagination_id);
		if (old_p!=null)
			div.removeChild(old_p);
		var old_ul=document.getElementById("flickrthumbs");
		if (old_ul!=null)
			div.removeChild(old_ul);
			
		var ul=document.createElement("ul");
		ul.className='flickrthumbs';
		ul.id='flickrthumbs';
		for (j=this.start; j<this.finish; j++)
		{
			var li=document.createElement("li");
			var a = document.createElement("a");
			if (full_mode=='f')
				a.href="http://static.flickr.com/"+this.data[j].server+"/"+this.data[j].id+"_"+this.data[j].secret+".jpg";
			else
				a.href="http://static.flickr.com/"+this.data[j].server+"/"+this.data[j].id+"_"+this.data[j].secret+"_"+full_mode+".jpg";
			
			a.title=this.data[j].title;
			a.rel="lightbox[kkk]";
			
			var img=document.createElement("img");
//			img.src="http://static.flickr.com/"+this.data[j].server+"/"+this.data[j].id+"_"+this.data[j].secret+"_"+thumbnail_mode+".jpg";
//			img.src="images/blank.gif";
			img.src=pic.src;
			img.width=thumbnail_width;
			img.height=thumbnail_height;
		
			
			img.alt=this.data[j].title;
			img.id=this.data[j].id;
			
			a.appendChild(img);
			li.appendChild(a);
			ul.appendChild(li);
		}	
		div.appendChild(ul);
		var p_div=document.createElement("ul");
		p_div.id=this.pagination_id;
		div.appendChild(p_div);
		this.pagination();
//		setFooter();
		this.preloadImgs(this.start)
		initLightbox();
	}
	
	this.preloadImgs = function(start)
	{
		var photo=this.data;
		var pic2 = new Image();
		finish=this.finish;
		this1=this;
		pid=start;
		pic2.src="http://static.flickr.com/"+photo[pid].server+"/"+photo[pid].id+"_"+photo[pid].secret+"_"+thumbnail_mode+".jpg";
		pic2.onload=new function() 
		{
			var new_pic=document.getElementById(photo[pid].id);
			new_pic.src=pic2.src;
			if (++pid<finish)
				this1.preloadImgs(pid);
		}
	}
	
}


function c_full_set()
{
	this.show = function()
		{
		this.recalc();
		var div=document.getElementById("flickrbox");
		var old_p=document.getElementById(this.pagination_id);
		if (old_p!=null)
			div.removeChild(old_p);
		var old_ul=document.getElementById("flickrthumbs");
		if (old_ul!=null)
			div.removeChild(old_ul);
		var ul=document.createElement("ul");
		ul.className='flickrthumbs';
		ul.id='flickrthumbs';
		for (j=this.start; j<this.finish; j++)
		{
			var li=document.createElement("li");
			var a = document.createElement("a");
			a.href="#";
			a.title=this.data[j].set_title;
			a.onmouseover	= new Function(this.name+".showDescription("+j+")");
			a.onmouseout	= new Function(this.name+".hideDescription()");
			a.onclick		= new Function(this.name+".showPhotos("+j+")");
			
			var img=document.createElement("img");
//			img.src="http://static.flickr.com/"+this.data[j].server+"/"+this.data[j].photo+"_"+this.data[j].secret+"_"+thumbnail_mode+".jpg";
			img.src=pic.src;
			img.width=thumbnail_width;
			img.height=thumbnail_height;
			
			img.alt=this.data[j].set_title;
			img.id=this.data[j].set_id;
			
			a.appendChild(img);
			li.appendChild(a);
			ul.appendChild(li);
		}	
		var p_div=document.createElement("ul");
		p_div.id=this.pagination_id;
		div.appendChild(ul);
		div.appendChild(p_div);
//		setFooter();
		this.preloadImgs(this.start)
		this.pagination();
	}
	
	this.preloadImgs = function(start)
	{
		var photo=this.data;
		var pic2 = new Image();
		finish=this.finish;
		this1=this;
		pid=start;
		pic2.src="http://static.flickr.com/"+photo[pid].server+"/"+photo[pid].photo+"_"+photo[pid].secret+"_"+thumbnail_mode+".jpg";
		pic2.onload=new function() 
		{
			var new_pic=document.getElementById(photo[pid].set_id);
			new_pic.src=pic2.src;
			if (++pid<finish)
				this1.preloadImgs(pid);
		}
	}
	
}


var flickr = new c_flickr('flickr');

c_photos.prototype=flickr;
var photos = new c_photos();
photos.name='photos';
photos.description_id='intro';
photos.pagination_id='flickrthumbs_pagination';

c_sets.prototype=flickr;
var sets = new c_sets();
sets.name='sets';
sets.description_id='intro';
sets.pagination_id='flickrset_pagination';

	
c_full_set.prototype=sets;
var fullSet = new c_full_set();
fullSet.name = 'fullSet';
fullSet.description_id='intro';
fullSet.pagination_id='flickrthumbs_pagination';