var Tabs = new Class({
	
	Implements: Class.Binds,
	
	active : null,
	
	initialize: function(nav, container){
		this.nav = document.id(nav);
		this.container = document.id(container);
		this.container.set('tween', {duration: 300, transition: 'cubic:in:out'});
		this.container.getChildren('div').fade('hide');
		this.nav.addEvent('click:relay(a)', this.bound('click'));
		
		var self = this;
		this.nav.getElements('a[data-tab]').each(function(a){
			var tab = a.get('data-tab');
			if(window.location.pathname.test('^/' + tab)){
				a.addClass('active');
				self.active = document.id(tab).fade('show');
				self.container.setStyle('height', self.active.getDimensions().height);
			}
		});
	},
	
	click: function(event, a){
		event.preventDefault();
		var tab = document.id(a.get('data-tab'));
		var height = 0;
		if(tab == this.active){
			tab.fade('out');
			a.removeClass('active');
			this.active = null;
		} else {
			if(this.active)
				this.active.fade('out');

			a.getParent('ul').getElements('a.active').removeClass('active');
			a.addClass('active');
			this.active = tab;
			height = this.active.getDimensions().height;
			this.active.fade('hide').fade('in');
		}
		this.container.tween('height', height);
	}
});

var App = new Class({
	
	Implements: [Class.Binds],
	
	initialize: function(){
		this.featureSlideshow();
		this.speakers();
		this.cipClip();
	},
	
	featureSlideshow: function(){
		var slideElement = document.id('feature');
		if(slideElement){
			var slideNav = new Navigation(slideElement.getElement('.nav'));
			var slideshow = new Slideshow(slideElement.getElement('.slideshow'), {
				onPages: function(pageCount){
					slideNav.createElements(pageCount);
				},
				onChange: function(i){
					slideNav.setActive(i);
				}
			});
			slideNav.addEvent('change', function(i){
				slideshow.gotoSlide(i);
			});
			slideElement.addEvent('click:relay(a.previous)', function(event, a){
				event.preventDefault();
				slideshow.previous();
			});
			slideElement.addEvent('click:relay(a.next)', function(event, a){
				event.preventDefault();
				slideshow.next();
			});
		}
	},
	
	speakers: function(){
		
		var speakers = $$('.speaker'),
			uri = new URI(window.location.href),
			fragment = uri.get('fragment'),
			speaker = document.id(fragment),
			display = (fragment && speaker) ? speakers.indexOf(speaker) : -1;
		var accordion = new Fx.Accordion($$('.toggler'), $$('.content'), {
			display: display,
			initialDisplayFx: false,
			alwaysHide: true,
			onActive: function(toggler){
				//window.location.hash = toggler.getParent().get('id');
				toggler.addClass('active');
			},
			onBackground: function(toggler){
				toggler.removeClass('active');
			}
		});
		
		window.addEvent('hashchange', function(fragment){
			var speaker = document.id(fragment),
			display = speaker ? speakers.indexOf(speaker) : -1;
			accordion.display(display);
		});
	},
	
	cipClip: function(){
		var cipclip = document.id('blog').getElement('.cipclip');
		new Request.JSONP({
			url: 'http://vimeo.com/api/v2/' + cipclip.get('data-channel') + '/videos.json',
			onComplete: function(videos){
				var video = videos[0];
				cipclip.setStyle('background', 'transparent url("' + video.thumbnail_medium + '") no-repeat left top');
			}
		}).send();
	}
});

document.addEvent('domready', function(){
	var tabs = new Tabs('nav-tabs', 'nav-items');
	var app = new App();

	if (Form.Placeholder)
		new Form.Placeholder('s');
});
