window.addEvent('domready', function() {
	// setting event for the anchors underneath each pic
	$$('.viewSelector li a').each(function(el, i) {
		el.addEvent('click', function(e){
	  		e.stop();	
			targetElement = el.getParent().getParent().getParent().getElements('div.'+el.get('rel'));
			if (el.get('class') == "videoSelector") {
				targetElement.getFirst().getFirst().set('src', el.get('href'));
				targetElement.getFirst().set('href', 'http://vimeo.com/moogaloop.swf');
				targetElement.getFirst().set('rel', 'shadowbox;width=640;height=385;options={flashVars:{clip_id:'+ el.get('id') +',autoplay:true}}');
			}else{
				targetElement = el.getParent().getParent().getParent().getElements('div.'+el.get('rel'));
				targetElement.getFirst().getFirst().set('src', el.get('href'));
				targetElement.getFirst().set('href', el.get('name'));				
			}
			// setup needs to be done everytime we switch media types to get a different type of 
			// shadowbox player loaded
			Shadowbox.setup();
	 	}); 
	});
	
	// hiding viewselector if just one element is displayed
	// and fixing the numbers
	viewSelector = $(document.body).getElements('ul.viewSelector');
	viewSelector.each(function(el){
		i=1;
		el.getElements('li a').each(function(li) {
			li.set('text', i++);
		});
		if(el.getElements('li').length <= "1") {
			el.destroy();
		}
	});

	$$('h3.campaignTitle').get('text').each(function(el, index) {
		var curPage       = window.location.href.split('#')[0];
		var targetElement = $$('div.campaignDescription.first>p')[index];
		var scrollToNavContainer = new Element('div', {
			'class': 'scrollToNav'
		})
		if ($$('h3.campaignTitle').get('text')[index-1]) {
			var prevNavText = new Element('span', {
				'text' : ' to ' + $$('h3.campaignTitle').get('text')[index-1]
			});
			var prevNavEl = new Element('a', {
				'href' : curPage+'#' + $$('h3.campaignTitle>a').get('name')[index-1],
				'text' : 'scroll up '
			});
			prevNavEl.inject(prevNavText, 'top');					
			prevNavText.inject(scrollToNavContainer, 'bottom');
		};
		if ($$('h3.campaignTitle').get('text')[index+1]) {
			var nextNavText = new Element('span', {
				'text' : ' to ' + $$('h3.campaignTitle').get('text')[index+1]
			});
			var nextNavEl = new Element('a', {
				'href' : curPage+'#' + $$('h3.campaignTitle>a').get('name')[index+1],
				'text' : 'scroll down'
			});
			nextNavEl.inject(nextNavText, 'top');
			nextNavText.inject(scrollToNavContainer, 'bottom');
		};
		scrollToNavContainer.inject(targetElement, 'after');
	})
	
	
});