/*

display loading symbol
load 


*/
var Loader = (function(){
	function constructor(_controller){
		this.controller = _controller;
		this.animation = $('<div/>').attr('id',"loader").appendTo('body');
		this.animation.css("left",($(window).width()-201)/2+"px");
		//make a cool loading animation
	}
	
	constructor.prototype.display = function(){
		this.animation.fadeIn();
	}
	
	constructor.prototype.hide = function(){
		this.animation.fadeOut();
	}
	
	return constructor;
})();

var UI = (function(){
	function constructor(_controller,_data){
		this.controller = _controller;
		this.data = _data;
		this.img = new Image();
		this.img.onload = (function(ui){return function(){ui.create();}})(this);
		
		this.ui = $("<div/>").attr('id','ui').appendTo('body').hide();
		this.content = $("<div/>").attr('id','content');
		this.title = $("<h1/>");
		this.logo = $("<div/>").attr('id','logo');
	}
	
	constructor.prototype.create = function(){
		//add stuff to stuff
		//$('<img/>').attr('src',this.data.photoset.photo[0].url_o).appendTo(this.ui);
		//this.controller.current.unwatch("img");
		$(this.img).appendTo(this.ui);
		this.title.text(this.controller.current.title).appendTo(this.ui);
		this.content.text(this.controller.current.description).appendTo(this.ui);
		this.logo.appendTo(this.content);
		if('Cufon' in window){Cufon.now();}

		
		this.display();
	}
	
	
	constructor.prototype.init = function(){
		this.img.src = this.data.photoset.photo[0].url_o;
		
		this.controller.getContent(0);
		//this.controller.current.watch("img",(function(i){return function(){alert(i.controller.current.img);i.img.src = i.controller.current.img;}})(this));
		
	}
	
	constructor.prototype.swap = function(){
		//back n next and all that, fade in and out	
	}
	
	constructor.prototype.fade = function(){
		this.controller.loader.display();
		this.ui.fadeOut();
	}
	
	constructor.prototype.display = function(){
		this.controller.loader.hide();
		this.ui.fadeIn();
	}
	
	
	return constructor;				 
})();

var CMDCMVXV = (function(){
	function constructor(_api,_id){
		this.api = _api;
		this.id = _id;
		this.url = "http://api.flickr.com/services/rest/?";
		this.title = "cmdcmvx";
		this.data;
		this.ui;
		this.loader;
		this.current = {};
	}
	
	constructor.prototype.populate = function(data){
		this.data = data;
		this.ui = new UI(this,this.data);
		this.ui.init();
	}
	
	constructor.prototype.setContent = function(content){
		this.current.title = content.photo.title._content;
		this.current.description = content.photo.description._content;
		//alert(this.data.photoset.photo[0].url_o);
	//	this.current.img = this.data.photoset.photo[0].url_o;
		//alert('moo');
	}
	
	constructor.prototype.getContent = function(id){
		$.getJSON(this.url+"method=flickr.photos.getInfo&api_key="+this.api+"&photo_id="+this.data.photoset.photo[id].id+"&format=json&jsoncallback=?",(function(e){return function(data){e.setContent(data);}})(this));
	}
	
	constructor.prototype.load = function(){
		this.loader = new Loader(this);
		$.getJSON(this.url+"method=flickr.photosets.getPhotos&api_key="+this.api+"&photoset_id="+this.id+"&extras=url_o&format=json&jsoncallback=?",(function(e){return function(data){e.populate(data);}})(this));
		//$("<script />").attr('src','f.js').appendTo('head');
		$("<link />").attr('rel','stylesheet').attr('href','c.css').appendTo('head');
		$("<title />").text(this.title).appendTo('head');
	}
	
	constructor.prototype.init = function(){
		document.documentElement.childNodes[0].appendChild(document.createElement('script')).setAttribute('src','http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js');
	}
	
	return constructor;
})();

window.onload = (function(c){c.init();return function(){c.load();}})(new CMDCMVXV("aa0b4c4ecfb3648ffb8f0e5018ed53e9","72157623229688201"));