FlickrGate = function(id)
{
	this._tid = id;
	this._params = {};
	this._callback;
	this._container;
	this._api_script;
}
FlickrGate.INTERESTINGNESS_DESC = "interestingness-desc";
FlickrGate.INTERESTINGNESS_ASC  = "interestingness-asc" ;
FlickrGate.DATE_POSTED_DESC     = "date-posted-desc"    ;
FlickrGate.DATE_POSTED_ASC      = "date-posted-asc"     ;
FlickrGate.RELEVANCE            = "relevance"           ;

FlickrGate.prototype = {
	initialize: function(key, id)
	{
		this._params.method = "flickr.photos.search";
		this._params.api_key = key;
		this._params.user_id = id;
		this._params.per_page = 24;
		this._params.privacy_filter = 1;
		this._params.content_type = 1;
		this._params.sort = FlickrGate.INTERESTINGNESS_DESC;
		this._params.format = "json";
		
		if(!window.jsonFlickrApi)
		{
			var _c = this;
			window.jsonFlickrApi = function(data)
			{
				_c.result(data);
			};
		}
		EventHandler.addListener(window, "load", "onload", this);
	},
	onload: function(e)
	{
		this.createAPIScript();
	},
	changeMethod: function(method)
	{
		this._params.sort = method;
		//console.log(method);
		while(this._container.childNodes.length>0)
		{
			this._container.removeChild(this._container.firstChild);
		}
		this.createAPIScript();
	},
	createAPIScript: function()
	{
		var head = document.getElementsByTagName("head").item(0);
		if(this._api_script) head.removeChild(this._api_script);
		
		var api = "http://api.flickr.com/services/rest/?";
		api += this.query(this._params);
		
		var script = document.createElement("script");
		script.setAttribute("src", api);
		script.setAttribute("type", "text/javascript");
		head.appendChild(script);
		
		this._api_script = script;
	},
	result: function(data)
	{
		if(!data) return;
		if(!data.photos) return;
		var list = data.photos.photo;
		if(!list) return;
		if(!list.length) return;
		
		this._container = document.getElementById(this._tid);
		var ul = document.createElement("ul");
		
		for(var i in list)
		{
			var p = list[i];
			
			var href = "http://www.flickr.com/photos/";
            href += p.owner+'/'+p.id+'/';
			
			var src = "http://static.flickr.com/";
			src += p.server+'/'+p.id+'_'+p.secret+'_s.jpg';
			
			var loading = new Image();
			loading.src = "img/loading.gif";
			
			var img = new Image();
			img.src = src;
			
			var a = document.createElement("a");
			a.setAttribute("href", href);
			a.setAttribute("target", "_blank");
			a.appendChild(img);
			a.style.display = "none";
			
			var li = document.createElement("li");
			li.style.width = 75 + "px";
			li.style.height = 75 + "px";
			li.style.textAlign = "center";
			li.style.lineHeight = 75/2 + 8 + "px";
			li.appendChild(loading);
			li.appendChild(a);
			ul.appendChild(li);
			
			EventHandler.addListener(img, "load", "onImageLoad", this);
		}
		this._container.appendChild(ul);
	},
	onImageLoad: function(e)
	{
		if(window.event) targetElement = window.event.srcElement
		else targetElement = e.target;
		
		var li = targetElement.parentNode.parentNode;
		var a = targetElement.parentNode;
		var loading = targetElement.parentNode.previousSibling;
		
		li.removeChild(loading);
		a.style.display = "block";
	},
	query: function(obj)
	{
		var q = [];
		for(var key in obj)
		{
			var k = encodeURIComponent(key);
        	var v = encodeURIComponent(obj[key]);
        	q[q.length] = k+"="+v;
		}
		var qstr = q.join("&");
		return qstr;
	}
}

FlickrGate.SortMethod = function(id, flickrGate)
{
	if(!id) return;
	if(!flickrGate) return;
	
	this._tid = id;
	this._flickrGate = flickrGate;
	
	EventHandler.addListener(window, "load", "initialize", this);
}
FlickrGate.SortMethod.prototype = {
	initialize: function(e)
	{
		var selector = document.getElementById(this._tid);
		EventHandler.addListener(selector, "change", "onChange", this);
	},
	onChange: function(e)
	{
		var targetElement;
		if(window.event) targetElement = window.event.srcElement
		else targetElement = e.target;
		
		if(targetElement.value==FlickrGate.INTERESTINGNESS_DESC)
		{
			this._flickrGate.changeMethod(FlickrGate.INTERESTINGNESS_DESC);
		}
		else if(targetElement.value==FlickrGate.INTERESTINGNESS_ASC)
		{
			this._flickrGate.changeMethod(FlickrGate.INTERESTINGNESS_ASC);
		}
		else if(targetElement.value==FlickrGate.DATE_POSTED_DESC)
		{
			this._flickrGate.changeMethod(FlickrGate.DATE_POSTED_DESC);
		}
		else if(targetElement.value==FlickrGate.DATE_POSTED_ASC)
		{
			this._flickrGate.changeMethod(FlickrGate.DATE_POSTED_ASC);
			//
		} else if(targetElement.value==FlickrGate.RELEVANCE)
		{
			this._flickrGate.changeMethod(FlickrGate.RELEVANCE);
			//
		} else {
			return;
		}
	}
}