var Site = {
	home: {
		options: {
			photoSelector: "#photoBlock .photo"
		},
		init: function() {
			var photos = $$(this.options.photoSelector);
			var photoitems = [];
			
			var specialOpts = {neverFade: true};
			
			photos.each(function(el, i) {
				photoitems.push(new PhotoItem(el, (i == 0) ? specialOpts : {}));
			});
			
			var specialPhoto = photos.splice(0, 1)[0];
			var specialPhotoItem = photoitems.splice(0, 1)[0];
			
			specialPhoto.addEvents({
				"mouseenter": function() {
					specialPhotoItem.show();
				},
				"mouseleave": function() {
					specialPhotoItem.restore();
				}
			});				
			
			photos.each(function(photo, i) {
				photo.addEvents({
					"mouseenter": function() {
						specialPhotoItem.hide();
						photoitems[i].show();
					},
					"mouseleave": function() {
						specialPhotoItem.restore();
						photoitems[i].hide();
					}
				});						
			});
		}
	
	},
	
	repertoire: {
		init: function() {
			var myVidManager = new VideoManager("videoSelect", "#videoSelect .video");
		}
	},
	
	getLatestTweets: function() {
		var url = 'http://api.twitter.com/1/statuses/user_timeline/SuedeEP.json?callback=Site.onTweets&count=3';
		var tag = document.createElement('script');
		tag.src = url;
		tag.type = 'text/javascript'
		var head = document.getElementsByTagName('head')[0]
		head.appendChild(tag)
	},
	
	onTweets: function(tweets) {
		var holder = $('tweets')
		tweets.each(function(tweet, i) {
			var wrap = new Element('a', {'class':'podItem', 'href':'http://twitter.com/SuedeEP/status/'+tweet.id});
			var body = new Element('span', {'class':'body', 'html':tweet.text});
			var date = new Element('span', {'class':'date', 'html':' '+tweet.created_at.split('+')[0]});
			wrap.adopt(body, date);
			holder.adopt(wrap);
		});
	},
	
	getLatestPosts: function() {
		var url = "http://ajax.googleapis.com/ajax/services/feed/load?q=http%3A%2F%2Ffeeds.feedburner.com%2Fsuede&v=1.0&callback=Site.onPosts&num=3";
		var tag = document.createElement('script');
		tag.src = url;
		tag.type = 'text/javascript'
		var head = document.getElementsByTagName('head')[0]
		head.appendChild(tag)
	},
	
	onPosts: function(postData) {
		var holder = $('blogPosts')
		postData.responseData.feed.entries.each(function(entry, i) {
			var wrap = new Element('div', {'class':'podItem'});
			var head = new Element('a', {'class':'headline', 'html':entry.title, 'href':entry.link})
			var body = new Element('span', {'class':'body', 'html':entry.contentSnippet});
			var date = new Element('span', {'class':'date', 'html':' '+entry.publishedDate.split('-')[0]});
			wrap.adopt(head, body, date);
			holder.adopt(wrap);
		});
	},
	
	share: function(a, type) {
		var url = {
			'twitter':'http://twitter.com/home?status={location}',
			'facebook':'http://www.facebook.com/sharer.php?u={location}&t={title}',
			'reddit':'http://http://reddit.com/submit?url={location}&title={title}',
			'digg':'http://digg.com/submit?url={location}',
			'delicious':'http://delicious.com/post?url={location}&title={title}'
		}[type];
		
		if (url) {
			var title = window.document.title;
			url = url.substitute({'location':urlencode(window.location), 'title':urlencode(title)});
			$(a).set('href', url);
		}
		return true;
	}
};

var VideoManager = new Class({
	Implements: [Events, Options],
	
	options: {
	
	},
	
	initialize: function(element, vidSelector) {
		this.element = $(element);
		//this.wrap = new Element("div").inject(this.element);
		
		var videos = $$(vidSelector);
		this.videos = [];
		
		videos.each(function(vid, i) {
			vid.addEvents({
				"mouseenter": function(e) {
					//e.stopPropagation();
					this.select(i, vid);
				}.bind(this),
				"mouseleave": function(e) {
					//e.stopPropagation();
					this.deselect(i, vid);
				}.bind(this),
				"click": function(e) {
					//e.stopPropagation();
					this.clicked(i, vid);
				}.bind(this)
			})
			this.videos.push(new VideoManager.Video(vid, i, this));
		}, this);		
	},
	
	select: function(index, video) {
		this.fireEvent("select", [index, video]);
	},
	
	deselect: function(index, video) {
		this.fireEvent("deselect", [index, video]);
	},
	
	clicked: function(index, video) {
		this.fireEvent("clicked", [index, video]);
	}
});

VideoManager.Video = new Class({
	Implements: [Events, Options],
	
	options: {
		deactiveSelector: ".deactive",
		activeSelector: ".active",
		offSelector: ".off",
		thumbSelector: ".videoThumbs",
		tipSelector: ".tooltip",
		endSize: {
			x: 233,
			y: 132
		}
	},
	
	initialize: function(element, id, manager) {
		this.element = $(element);
		
		this.id = id;
		this.manager = manager;
		
		this.startSize = this.element.getSize();

		this.startStyles = {};
		this.startStyles["0"] = { "height":this.startSize.y, "width": this.startSize.x};
		this.startStyles["1"] = { "height":this.startSize.y, "width": this.startSize.x};
		this.startStyles["2"] = { "height":this.startSize.y, "opacity": 1, "width": this.startSize.x};
		this.startStyles["3"] = { "height":this.startSize.y, "opacity": 0, "width": this.startSize.x};
		//this.startStyles["4"] = { "height":this.startSize.y, "opacity": 0, "width": this.startSize.x};

		this.activeStyles = {};
		this.activeStyles["0"] = { "height":this.options.endSize.y, "width": this.options.endSize.x};
		this.activeStyles["1"] = { "height":this.options.endSize.y, "width": this.options.endSize.x};
		this.activeStyles["2"] = { "height":this.options.endSize.y, "opacity": 0, "width": this.options.endSize.x};
		this.activeStyles["3"] = { "height":this.options.endSize.y, "opacity": 1, "width": this.options.endSize.x};
		//this.activeStyles["4"] = { "height":this.options.endSize.y, "opacity": 0, "width": this.options.endSize.x};

		this.deactiveStyles = {};
		this.deactiveStyles["0"] = { "height":this.options.endSize.y, "width": 144};
		this.deactiveStyles["1"] = { "height":81, "width": 144};
		this.deactiveStyles["2"] = { "height":81, "opacity": 1, "width": 144};
		this.deactiveStyles["3"] = { "height":81, "opacity": 0, "width": 144};
		//this.deactiveStyles["4"] = { "height":81, "opacity": 1, "width": 144};
		
		
		//this.deactive = this.element.getElement(this.options.deactiveSelector);
		this.active = this.element.getElement(this.options.activeSelector);
		this.off = this.element.getElement(this.options.offSelector);
		
		var tooltip = this.element.getElement(this.options.tipSelector);
		if (tooltip) {
			this.tooltip = new Fx.Tween(this.element.getElement(this.options.tipSelector), {link: "cancel", property: "opacity"}).set(0);
			this.tooltip.element.show();
			this.tooltip.element.setStyles({
				left:0,
				bottom: this.options.endSize.y + 15
			});
		}
		
		this.thumbs = this.element.getElement(this.options.thumbSelector);
		
		this.elements = new Fx.Elements($$(this.element, this.thumbs, this.off, this.active), { duration: 500, link: "cancel"}).set(this.startStyles);
		
		this.setBound();		
		this.attach();
	},
	
	toElement: function() {
		return this.element;
	},
	
	setBound: function() {
		this.bound = {
			tooltip: this.tipComplete.bind(this)
		};
	},
	
	tipComplete: function() {
		if (this.tooltip) this.tooltip.start(1);
	},
	
	attach: function() {
		this.manager.addEvents({
			"select": function(index, video) {
				this.select(index);
			}.bind(this),
			"deselect": function(index, video) {
				this.deselect(index);
			}.bind(this),
			"clicked": function(index, video) {
				this.clicked(index);
			}.bind(this)			
		});
	},
	
	select: function(index) {
		this.elements.removeEvent("complete", this.bound.tooltip);			
		if (index == this.id) {			
			this.elements.addEvent("complete", this.bound.tooltip);
			this.elements.start(this.activeStyles);
		}
		else {
			if (this.tooltip) this.tooltip.cancel().set(0);
			this.elements.start(this.deactiveStyles);			
		}
	},
	
	deselect: function(index) {		
		this.elements.removeEvent("complete", this.bound.tooltip);	
		if (this.tooltip) this.tooltip.cancel().set(0);
		this.elements.start(this.startStyles);
		
	},
	
	clicked: function(index) {
		if (index != this.id) return;
		// do stuff
	}
});

var PhotoItem = new Class({
	Implements: [Events, Options],
	
	options: {
		offSelector: ".offItem",
		onSelector: ".onItem",
		tipSelector: ".tooltip",
		fxSpeed: 500,
		neverFade: false		
	},
	initialize: function(el, opts) {
		this.setOptions(opts);
		
		this.element = $(el);
		
		this.off 	= this.element.getElement(this.options.offSelector);
		this.on 	= this.element.getElement(this.options.onSelector);
		this.tip 	= this.element.getElement(this.options.tipSelector);
		
		this.tip.set("opacity", 0).show();
		
		this.opacity = (this.options.neverFade) ? 0 : 1;
		
		this.off = new Fx.Tween(this.off, {property: "opacity", duration: this.options.fxSpeed, link: "cancel"}).set(this.opacity);
		this.tip = new Fx.Tween(this.tip, {property: "opacity", duration: this.options.fxSpeed, link: "cancel"}).set(0);

	},
	
	restore: function() {
		this.off.start(this.opacity);
		this.tip.start(0);
	},
	
	show: function() {
		this.off.start(0);
		this.tip.start(1);		
	},
	
	hide: function() {
		this.off.start(1);
		this.tip.start(0);		
	},
	
	toElement: function() {
		return this.element;
	}
});


function urlencode(str) {
	return escape(str).replace(/\+/g,'%2B').replace(/%20/g, '+').replace(/\*/g, '%2A').replace(/\//g, '%2F').replace(/@/g, '%40');
}