var Hero = function (container, slides, counter, delay, aspect_ratio) {
	this.container = container;
	this.slides = slides;
	this.counter = counter;
	this.delay = delay;
	this.transition = 500; /* speed of transition animation */
	this.aspect_ratio = aspect_ratio; /* width/height ratio of slide images */
	this.current = 0;
	this.prevBtn = this.container.find('.prev');
	this.nextBtn = this.container.find('.next');
	this.setup();
};
Hero.prototype = {
	setup: function () {
		var self = this;
		
		var stopped = false;
		
		this.nav();

		this.prevBtn.click(function() {
			self.prev();
			self.pause();
			stopped = true;
		});
		this.nextBtn.click(function() {
			self.next();
			self.pause();
			stopped = true;
		});
		$j('#welcome_trigger').click(function() {
			self.pause();
			stopped = true;
		});		
		$j('#welcome_popup').find('.close').click(function() {
			self.start();
		});
		
		/* lock in left/top values for CTAs */
		$j('#slideshow .cta').each(function() {
			$j(this).attr({
				'left': $j(this).css('left').replace(/[^-\d\.]/g, ''),
				'top': $j(this).css('top').replace(/[^-\d\.]/g, '')
			});
		});
		
		/* lock in width/height value of CTAs */
		$j('#slideshow .cta img').each(function() {
			$j(this).attr({
				'original_width': $j(this).attr('width'),
				'original_height': $j(this).attr('height')
			});
		});
		
		this.adjust();

		$j('#slideshow').addClass('visible');
		
		this.start();
		$j(window).resize(function() {
			self.resize_it();
		});
		
		
	},
	nav: function() {
		// create the counter for slide navigation
		var self = this;
		
		this.counter.append('<ol></ol>');
		for (i = 1; i <= this.slides.size(); i++) {
			this.counter.find('ol').append('<li>Slide ' + i + '</li>');
		}
		this.counter.find('li:first').addClass('active');

		/*
		this.counter.find('li').click(function(i) {
			var index = self.counter.find('li').index(this);
			self.goTo(index);
		});
		*/
	},
	goTo: function (idx) {
		var self = this;
		var old_index = this.slides.index(this.slides.filter('.active'));
		if (idx === this.current) {	return; }
		this.current = idx;

		var slide_width = this.slides.eq(0).find('img').width();

		// transitioning forward
		if (old_index < idx) {
			// special case for transitioning to last slide from first slide
			if (old_index == 0 && idx == (this.slides.size() -1)) {
				this.slides.eq(idx).css({'left': -slide_width});
				this.slides.eq(old_index).animate({'left': slide_width}, this.transition, 'swing');
				this.slides.eq(idx).animate({'left': 0}, this.transition, 'swing');
			}
			else {
				this.slides.eq(idx).css({'left': slide_width});
				this.slides.eq(old_index).animate({'left': -slide_width}, this.transition, 'swing');
				this.slides.eq(idx).animate({'left': 0}, this.transition, 'swing');
			}
		}
		// transitioning backward
		if (old_index > idx) {
			// special case for transitioning to first slide from last slide
			if (idx == 0 && (old_index == (this.slides.size() -1))) {
				this.slides.eq(idx).css({'left': slide_width});
				this.slides.eq(old_index).animate({'left': -slide_width}, this.transition, 'swing');
				this.slides.eq(idx).animate({'left': 0}, this.transition, 'swing');
			}
			else {
				this.slides.eq(idx).css({'left': -slide_width});
				this.slides.eq(old_index).animate({'left': slide_width}, this.transition, 'swing');
				this.slides.eq(idx).animate({'left': 0}, this.transition, 'swing');
			}
		}
		this.slides.removeClass("active").eq(idx).addClass("active");
		this.counter.find('li').removeClass('active').eq(idx).addClass('active');
	},
	adjust: function() {
		var self = this;
		var aspect_ratio = this.aspect_ratio;
		var window_width = $j(window).width();
		var window_height = $j(window).height();
		var margin = -(window_width-970)/2;

		// resize wrapper (to position prev/next toggles)
		$j('#slideshow .wrapper').css({'width': window_width, 'height': window_width/aspect_ratio});
		
		// adjust toggles
		$j('#slideshow .togglers div').css({'top': window_height/2});
		
		// resize the main slide image
		$j('#slideshow img.photo').css({'width': window_width, 'height': window_width/aspect_ratio});
		
		// resize CTAs based on percentage difference with source
		$j('#slideshow .cta img').each(function() {
			$j(this).css({
				'width': $j(this).attr('original_width') * window_width/1600,
				'height': $j(this).attr('original_height') * window_width/1600
			});
		});
		
		// adjust position of CTAs
		$j('#slideshow .cta').each(function() {
			$j(this).css({
				'left': $j(this).attr('left') * window_width/1600,
				'top': $j(this).attr('top') * window_width/1600
			});
		});
		
		
		var t_margin_left = 0;
		if(window_width > 970){
			t_margin_left = margin;
		}
		$j('#slideshow').css({'margin-left': t_margin_left, 'margin-right': margin, 'height': window_height, 'width': window_width});
		
		// adjust min-height of body and slideshow
		// scale is based on ideal window dimensions at default aspect ratio
		$j('body, #slideshow').css({'min-height': window_width/aspect_ratio});
		
		// reposition all inactive slides (active slide fixed at left: 0)
		this.slides.not('.active').css({'left': window_width});

		if ($j('#slideshow').height() <= window_height) {
			// height scaling
			$j('#slideshow img.photo').css({
				'height': window_height,
				'width': window_height*aspect_ratio,
				'margin-left': (window_width - window_height*aspect_ratio)/2,
				'margin-right': (window_width - window_height*aspect_ratio)/2
			});

			$j('#slideshow .cta a').each(function() {
				$j(this).css({
					'width': $j(this).attr('width') * window_width/1600,
					'height': $j(this).attr('height') * window_width/1600
				});
			});
			
			$j('#slideshow .cta').each(function() {
				$j(this).css({
					'left': $j(this).attr('left') * $j('#slideshow img.photo').width()/1600 + (window_width - window_height*aspect_ratio)/2,
					'top': $j(this).attr('top') * $j('#slideshow img.photo').width()/1600
				});
			});
		
			this.slides.not('.active').css({'left': window_width + 15 - (window_width - window_height*aspect_ratio)/2});
		}
		else {
			$j('#slideshow img.photo').css({
				'margin-left': 0,
				'margin-right': 0
			});
		}
		
		$j('body').css('height', $j(window).height());
	},
	start: function () {
		if (this.timer) {
			return;
		}
		var self = this;
		this.timer = setTimeout(function(){
			self.next();
		}, this.delay * 1000);
	},
	pause: function () {
		//ev.preventDefault;
		if (this.timer) {
			clearTimeout(this.timer);
			this.timer = false;
		}
		else { return; }
	},
	prev: function() {
		this.pause();
		if (this.current == 0) {
			this.goTo(this.slides.length - 1);
		}
		else {
			this.goTo(this.current - 1);
		}
		this.start();
	},
	next: function() {
		this.pause();
		if (this.current === this.slides.length - 1) {
			this.goTo(0);
		}
		else {
			this.goTo(this.current + 1);
		}
		this.start();
	},
	resize_it: function() {
		var self = this;
		this.pause();
		this.adjust();
		this.start();
	}
};

$j(document).ready(function () {
	new Hero($j('#slideshow'), $j('#slideshow .slide'), $j('#slideshow_counter'), 6, 1600/1087);
	
	new PopUp($j('#welcome_trigger'), $j('#welcome_popup'), {modal: true, centered: true});
	
	Cufon.replace('#welcome_popup .header', {fontFamily: 'Gotham Medium'});
	Cufon.replace('#welcome_popup .closing', {fontFamily: 'Gotham Medium'});
	
	if ($j('#container ul.messages').length) {
		$j('#container ul.messages').delay(7000).fadeOut();
	}
	/*if ($j(window).width() > 1900 && $j(window).height() > 830) {
		//$j('.slide').find('img:first').css({width: 1700});
		//alert('yes');
		$j('.footer').css({marginTop: '-410px'});
	}
	if (location.hostname == '192.168.1.138'){
		$j('.tout').css({border: '1px solid black', background: 'white'});
	}
	$j(window).resize(function(){
		//console.log('moving...');
	})*/


});