var Site = new Class({
	
	// Flickr properties
	userId: '59999943@N00',
	setIds: new Hash({
				'Info': '72157611951485690',
				'Identity': '72157611901374077',
				'Print': '72157611903576123',
				'Interactive': '72157611901928201',
				'Etc.': '72157611954282794'
			}),

	initialize: function () {
		var o = this;
		var index = 0;
		this.setIds.each(function (v, k, h) {
			var e = o.generate(k);
			$('flickr').grab(e);
			index++;
		}, this);
	},

	scrollToIndex: function (e) {
		var li = e.target.getParent();
		var index = li.get('rel').toInt();
		if (index > 0) {
			var el = $('flickr').getChildren()[index];
		} else {
			var el = $('content');
		}
		new Fx.Scroll(window).toElement(el);
	},

	generate: function (setKey) {
		// check that the set ID exists
		if (!this.setIds.has(setKey)) return null;
		// determine the set index
		var setIndex = this.getIndexOfSetKey(setKey);
		// get the set ID
		var setId = this.setIds.get(setKey);
		// create the element IDs
		var containerId = 'ssc-'+setId;
		var swfId = 'ss-'+setId;
		// create the elements
		var container = new Element('div', { 'class':'set' });
		var header = new Element('img', { 'class':'header', 'src':'img/item-index-'+(setKey.replace(/[^a-z]/i, '').toLowerCase())+'.png' }).inject(container);
		var swfOuter = new Element('div', { 'class':'ss' }).inject(container);
		var swfInner = new Element('div', { 'id':swfId }).inject(swfOuter);
		var footer = new Element('div', { 'class':'footer' }).inject(container);
		var footerULL = new Element('ul', { 'class':'left' }).inject(footer);
		var footerULR = new Element('ul', { 'class':'right' }).inject(footer);
		// determine what goes in the footer
		if (setIndex < this.setIds.getLength()-1) {
			var footerNextImg = new Element('img', { src:'img/item-next.png' });
			var footerNext = new Element('li', { 'rel':setIndex+1 }).grab(footerNextImg).inject(footerULL);
			footerNext.addEvent('click', this.scrollToIndex.bind(this));
			footerNext.addEvent('mouseenter', function () { new Fx.Tween(this, { duration:100 }).start('opacity', 0.2); });
			footerNext.addEvent('mouseleave', function () { new Fx.Tween(this, { duration:100 }).start('opacity', 1.0); });
		}
		if (setIndex > 0) {
			var footerPrevImg = new Element('img', { src:'img/item-prev.png' });
			var footerPrev = new Element('li', { 'rel':setIndex-1 }).grab(footerPrevImg).inject(footerULL);
			footerPrev.addEvent('click', this.scrollToIndex.bind(this));
			footerPrev.addEvent('mouseenter', function () { new Fx.Tween(this, { duration:100 }).start('opacity', 0.2); });
			footerPrev.addEvent('mouseleave', function () { new Fx.Tween(this, { duration:100 }).start('opacity', 1.0); });
		}
		var footerTopImg = new Element('img', { src:'img/item-top.png' });
		var footerTop = new Element('li', { 'rel':'-1' }).grab(footerTopImg).inject(footerULR);
		footerTop.addEvent('click', this.scrollToIndex.bind(this));
		footerTop.addEvent('mouseenter', function () { new Fx.Tween(this, { duration:100 }).start('opacity', 0.2); });
		footerTop.addEvent('mouseleave', function () { new Fx.Tween(this, { duration:100 }).start('opacity', 1.0); });
		// set the options 
		var o = {
			url: 'http://www.flickr.com/apps/slideshow/show.swf',
			id: swfId,
			size: { w:700, h:525 },
			version: '8.0.0',
			xi: false,
			fvars: {
				offsite:true,
				lang:'en-us',
				page_show_url:encodeURIComponent('/photos/'+this.userId+'/sets/'+setId+'/show/'),
				page_show_back_url:encodeURIComponent('/photos/'+this.userId+'/sets/'+setId+'/'),
				set_id:setId,
				jump_to:'' },
			params: { menu:false, bgcolor:'#000000', allowFullScreen:true },
			attrs: { id:swfId, name:swfId }
		};
		// embed the SWF
		swfobject.embedSWF(
			o.url,
			o.id,
			o.size.w,
			o.size.h,
			o.version,
			o.xi,
			o.fvars,
			o.params,
			o.attrs);
		// return the container element
		return container;
	},

	getSetIdAtIndex: function (index) {
		var id = null;
		var i = 0;
		this.setIds.each(function (v, k, h) {
			if (index == i++) id = v;
		}, this);
		return id;
	},
	getSetKeyAtIndex: function (index) {
		var key = null;
		var i = 0;
		this.setIds.each(function (v, k, h) {
			if (index == i++) key = k;
		}, this);
		return key;
	},
	getIndexOfSetId: function (setId) {
		var index = 0;
		var i = 0;
		this.setIds.each(function (v, k, h) {
			if (v == setId) index = i;
			i++;
		}, this);
		return index;
	},
	getIndexOfSetKey: function (setKey) {
		var index = 0;
		var i = 0;
		this.setIds.each(function (v, k, h) {
			if (k == setKey) index = i;
			i++;
		}, this);
		return index;
	}

});

var site;

window.addEvent('domready', function () {

	// setup the nav items
	$$('#header li[rel]').each(function (e, i) {
		e.addEvent('mouseenter', function () { new Fx.Tween(this, { duration:100 }).start('opacity', 0.2); });
		e.addEvent('mouseleave', function () { new Fx.Tween(this, { duration:100 }).start('opacity', 1.0); });
		if ($defined(e.get('rel'))) {
			if (/^[0-9]$/.test(e.get('rel'))) {
				e.addEvent('click', function (e) {
					new Fx.Scroll(window).toElement($('flickr').getChildren()[e.target.getParent().get('rel').toInt()]);
				});
			} else if (e.get('rel') == 'e') {
				e.addEvent('click', function (e) {
					location.href = 'mailto:hello@briankroeker.com';
				});
			} else if (e.get('rel') == 'b') {
				e.addEvent('click', function (e) {
					location.href = 'http://fastandbulbous.tumblr.com/';
				});
			}
		}
	});

	// create the slideshows
	site = new Site();

});