var __FlickrCallbacks = {};

var Flickr = (function() {
	var callCount = 0;
	var apiKey = "";

	function sendRequest(method, content, callback) {
		callCount++;

		var url = "http://www.flickr.com/services/rest/"
			+ "?method=" + method
			+ "&format=json"
			+ "&api_key=" + apiKey
			+ "&jsoncallback=__FlickrCallbacks.fn_" + callCount
			+ "&time=" + new Date().getTime();

		if (content) {
			for (var a in content) {
				if (content.hasOwnProperty(a)) {
					url += "&" + a + "=" + encodeURIComponent(content[a]);
				}
			}
		}
		var script = document.createElement("script");

		__FlickrCallbacks["fn_" + callCount] = 
			function(res) {
				document.body.removeChild(script);
				if (callback)
					callback(res);
			};

		script.setAttribute("type", "text/javascript");
		document.body.appendChild(script);
		script.src = url;
	}

	return {

		setAPIKey : function(key) {
			apiKey = key;
		},

		callMethod : function(method, content, callback) {
			sendRequest(method, content, callback);
		}
	}

})();


Flickr.setAPIKey("15dcd0ac28ab119346a34aaac1aea50a");

var numPhotos = 32;
var numPhotosInQueue = 0;

function loadImages(query) {
	numPhotosInQueue = numPhotos;
	Flickr.callMethod(
		"flickr.photos.search", {
			text : location.search||"",
			extras : "owner_name,license",
			sort : "relevance",
			per_page : numPhotos,
			//group_id : "31917163@N00",
			media : "photos",
			license : "4,2,1,5"
		},
		onPhotosFound
	);
	document.getElementById("output").innerHTML = "Sending Flickr request.";
}

var photos = [];
var photosByBrightness = [];
var levels = 256;

function onPhotosFound(res) {
	if (res.photos && res.photos.photo) {
		var p = res.photos.photo;

		document.getElementById("output").innerHTML = "Found " + p.length + " photos.";

		for (var i=0;i<p.length;i++) {
			(function() {
			var photo = p[i];
			var url = "http://farm"+photo.farm+".static.flickr.com/"+photo.server+"/"+photo.id+"_"+photo.secret+"_s.jpg";
			var img = document.createElement("img");
			img.onload = function() {
				setTimeout( function() {
					if (img.complete) {
						var canvas = document.createElement("canvas");
						canvas.width = canvas.height = 1;
						var ctx = canvas.getContext("2d");
						ctx.drawImage(img, 0,0,75,75, 0,0,1,1);
						var data = ctx.getImageData(0,0,1,1).data;
		
						var r = data[0], g = data[1], b = data[2];
						var bright = Math.round(r*0.3 + g*0.59 + b*0.11);

						var numAreas = 256 / levels;
						var numValues = 256 / (levels-1);

						bright = Math.floor(numValues * ((bright / numAreas)>>0));
						if (!photosByBrightness[bright])
							photosByBrightness[bright] = [];
		
						photosByBrightness[bright].push(
							{
								img : img,
								r : r, g : g, b : b
							}
						)
						//console.log(data);
					}
					document.getElementById("output").innerHTML = "Loading photos.. " + numPhotosInQueue + " to go!";

					numPhotosInQueue--;
					if (!numPhotosInQueue) {
						onPhotosLoaded();
					}
				}, 1);
			}
			img.onerror = function() {
				numPhotosInQueue--;
				if (!numPhotosInQueue) {
					onPhotosLoaded();
				}
			}
			img.src = "flickrproxy.php?url=" + encodeURIComponent(url);
			})();
		}
	} else {
		document.getElementById("output").innerHTML = "Oops! Bad Flickr request.";
	}
}


function onPhotosLoaded() {
	document.getElementById("output").style.display = "none";
	render();
}