// JavaScript Document for BGE Homepage

/****************************************************
* Homepage Banner									*
*													*
*****************************************************/

var HomepageBanner = new Class({

	Implements: [Events, Options],

	options: {
		speed: 2000
	},

	initialize: function(wrapper, options){
		this.setOptions(options);
		
		this.wrapper = wrapper;
		this.timer = null;
		this.currentSlide = this.nextSlide = 0;
		this.imgsLoaded = [true];
		this.transition = null;
		
		this.buildSlides();		
		
		/*$each(this.wrapper.getElements('.slide'), function(slide,i){
			slide.addEvents({
				'mouseenter': function(){
					$clear(this.timer);
				}.bind(this),
				'mouseleave': function(){
					this.autoAnimate();
				}.bind(this)
			});			
		}.bind(this));*/
		
		if('ontransitionend' in window){
			transition = 'transitionend';
		} else if('onwebkittransitionend' in window) {
			transition = 'webkitTransitionEnd';
		} else if('onotransitionend' in this.wrapper || navigator.appName == 'Opera') {
			transition = 'oTransitionEnd';
		}
		
		this.wrapper.addEvents({
			transition: function(){
			}
		});
		
		if('ontouchstart' in window) {
		}
		
		if('touchend' in window) {
		}
		
		/*if(this.wrapper.getElements('.slide').length > 1){
			this.play = new Element('div', {
				'class': 'control play'
			}).inject(this.wrapper);
			
			this.pause = new Element('div', {
				'class': 'control pause'
			}).inject(this.wrapper);
			
			this.back = new Element('div', {
				'class': 'control back'
			}).inject(this.wrapper);
			
			this.forward = new Element('div', {
				'class': 'control forward',
				'events': {
					'click': function(){
					}.bind(this)
				}
			}).inject(this.wrapper);
		}*/
		
		this.next();
	},
	
	buildSlides: function(){
		var hc = this, slide, slide_inner, image = [], img, info, info_inner;
		var carousel_top, text_holder, text, title, description;
		var link_div, link_div_a, carousel_base, img_asset;
		
		$each(banners, function(banner, i){
			if(i > 0){
				slide = new Element('div', {
					'class': 'slide slide-inactive'
				}).inject(hc.wrapper);
				
				slide_inner = new Element('div', { 'class': 'slide-inner' }).inject(slide);
				image[i] = new Element('div', { 'class': 'image' }).inject(slide_inner);
				img_asset = Asset.images([root + banner.url], {
					onComplete: function(){
						hc.imgsLoaded[i] = true;
						img = new Element('img', {
							'src': banner.url,
							'alt': banner.keyword,
							'width': 757,
							'height': 266
						}).inject(image[i]);
					}
				});
				
				info = new Element('div', { 'class': 'info ' +  banner.side }).inject(slide_inner);
				info_inner = new Element('div', { 'class': 'info-inner' }).inject(info);
				carousel_top = new Element('div', { 'class': 'carousel-top' }).inject(info_inner);
				text_holder = new Element('div', { 'class': 'text-holder' }).inject(info_inner);
				text = new Element('div', { 'class': 'text ' +  banner.color }).inject(text_holder);
				
				title = new Element('div', {
					'class': 'title',
					'html': banner.title
				}).inject(text);
				
				description = new Element('div', {
					'class': 'description',
					'html': banner.description
				}).inject(text);
				
				link_div = new Element('div', { 'class': 'link' }).inject(info_inner);
				link_div_a = new Element('a', {
					'href': banner.button_url,
					'html': banner.button_text
				}).inject(link_div);
				
				carousel_base = new Element('div', { 'class': 'carousel-base' }).inject(info_inner);
			}
		});
	},
	
	next: function(){
		if(this.currentSlide == banners.length - 1){
			this.nextSlide = 0;
		} else {
			this.nextSlide = this.currentSlide + 1;
		}
		
		this.timer = this.show.delay(1000*banners[this.currentSlide].time_banner.toInt(), this, [this.currentSlide, this.nextSlide]);
	},
	
	show: function(current, next){
		if(banners[current]){
			$clear(this.timer);
			if(this.imgsLoaded[current]){
				if($('homepage-banner-enlarged').getElements('.slide')[current] && $('homepage-banner-enlarged').getElements('.slide')[next]){					
					$('homepage-banner-enlarged').style.opacity = '0';
					this.reveal.delay(1500, this, [current, next]);
				}
			} else {
				this.show.delay(500, this, [current, next]);
			}
		}
	},
	
	reveal: function(current, next){
		$('homepage-banner-enlarged').getElements('.slide').addClass('slide-inactive');
		$('homepage-banner-enlarged').getElements('.slide')[next].removeClass('slide-inactive');
		$('homepage-banner-enlarged').style.opacity = '1';
		this.currentSlide = next;
		this.next();
	}
});





/****************************************************
* Homepage Carousel									*
*													*
*****************************************************/

var HomepageCarousel = new Class({

	Implements: [Events, Options],

	options: {
		speed: 600
	},

	initialize: function(wrapper, options){
		this.setOptions(options);
		
		this.wrapper = wrapper;
		this.ul = this.wrapper.getElements('#featured ul');
		if(this.ul.length > 0){
			this.ul = this.ul[0];
		} else {
			return;
		}
		
		this.lis = this.ul.getElements('li');
		this.currentPort = 0;
		this.totalPorts = Math.ceil(this.lis.length/3);		
		this.busy = false;
		
		this.shutter = new Element('div', {
			'class': 'shutter'
		}).inject(this.ul.getParent().getParent());
		
		this.imgCovers = new Element('div', {
			'class': 'img-covers'
		}).inject(this.ul.getParent().getParent());
		this.imgCoversUl = null;
		this.imgCoversLis = [];
		this.ulWidth = 0;
		
		
		if(this.lis.length > 0){
			this.ulWidth = this.lis[0].getSize().x * this.lis.length;
			this.imgCoversUl = new Element('ul').inject(this.imgCovers);			
			$each(this.lis, function(li,i){
				this.imgCoversLis[i] = new Element('li', {
					'events': {
						'click': function(){							
							if(this.lis[i].getElement('a')){
								this.lis[i].getElement('a').fireEvent('click');
							}
							
						}.bind(this),
						'mouseenter': function(){
							if(this.lis[i].getElement('.sifrCover')){
								this.lis[i].getElement('.sifrCover').fireEvent('mouseenter');
							} else {
								if(this.lis[i].getElement('a')){
									if(!this.lis[i].getElement('a').hasClass('covered')){
										this.lis[i].getElement('a').addClass('covered');
									}
								}
							}
						}.bind(this),
						'mouseleave': function(){
							if(this.lis[i].getElement('.sifrCover')){
								this.lis[i].getElement('.sifrCover').fireEvent('mouseleave');
							} else {
								if(this.lis[i].getElement('a')){
									this.lis[i].getElement('a').removeClass('covered');
								}
							}
						}.bind(this)
					}
				}).inject(this.imgCoversUl);
			}.bind(this));
			
		if(this.lis.length > 3){
				this.leftButton = new Element('div', {
					'class': 'left-but',
					'events': {
						'click': function(){ this.slide('left'); }.bind(this),
						'mouseenter': function(){
							if(this.leftButton.getElement('div')){
								if(this.leftButton.getElement('div').currentStyle.filter){
									this.leftButton.getElement('div').style.filter = this.leftButton.getElement('div').currentStyle.filter.replace('_prev.png', '_prev_over.png');
								}
							} else {
								this.leftButton.setStyle('background-image', this.leftButton.getStyle('background-image').replace('_prev.png', '_prev_over.png'));
							}														
						}.bind(this),					
						'mouseleave': function(){
							if(this.leftButton.getElement('div')){
								if(this.leftButton.getElement('div').currentStyle.filter){
									this.leftButton.getElement('div').style.filter = this.leftButton.getElement('div').currentStyle.filter.replace('_prev_over.png', '_prev.png');
								}
							} else {
								this.leftButton.setStyle('background-image', this.leftButton.getStyle('background-image').replace('_prev_over.png', '_prev.png'));
							}														
						}.bind(this)
					}
				}).inject(this.wrapper);
				
				this.rightButton = new Element('div', {
					'class': 'right-but',
					'events': {
						'click': function(){ this.slide('right'); }.bind(this),
						'mouseenter': function(){
							if(this.rightButton.getElement('div')){
								if(this.rightButton.getElement('div').currentStyle.filter){
									this.rightButton.getElement('div').style.filter = this.rightButton.getElement('div').currentStyle.filter.replace('_next.png', '_next_over.png');
								}
							} else {
								this.rightButton.setStyle('background-image', this.rightButton.getStyle('background-image').replace('_next.png', '_next_over.png'));
							}
						}.bind(this),
						'mouseleave': function(){
							if(this.rightButton.getElement('div')){
								if(this.rightButton.getElement('div').currentStyle.filter){
									this.rightButton.getElement('div').style.filter = this.rightButton.getElement('div').currentStyle.filter.replace('_next_over.png', '_next.png');
								}
							} else {
								this.rightButton.setStyle('background-image', this.rightButton.getStyle('background-image').replace('_next_over.png', '_next.png'));
							}							
						}.bind(this)
					}
				}).inject(this.wrapper);
			}
		}				

		
		this.fx_ob = {};
		this.fx = null;
		if(this.ul.getParent().getParent().getElements('ul').length == 2){
			this.fx = new Fx.Elements(this.ul.getParent().getParent().getElements('ul'), {
				duration: this.options.speed,
				transition: Fx.Transitions.Cubic.easeOut,
				onComplete: function(){
					this.busy = false;
				}.bind(this)
			});
		}
	},
	
	slide: function(dir){
		if(this.busy){ return; }
		this.busy = true;
		this.fx_ob = {};			
		
		if(this.fx){
			if(dir == 'left'){
				if(this.currentPort > 0){
					this.currentPort--;
				}
			} else {
				if(this.currentPort < (this.totalPorts-1)){
					this.currentPort++;
				}
			}
			
			if(-1 * this.currentPort * 759 < (-1 * this.ulWidth) + 759){
				this.fx_ob[0] = { 'margin-left': -1 * this.ulWidth + 759 };
				this.fx_ob[1] = { 'margin-left': -1 * this.ulWidth + 759 };
			} else {
				this.fx_ob[0] = { 'margin-left': -1 * this.currentPort * 759 };
				this.fx_ob[1] = { 'margin-left': -1 * this.currentPort * 759 };
			}
			
			this.fx.start(this.fx_ob);
		}
	}
});




/****************************************************
* Attach Google Analytics Event Tracking			*
*													*
*****************************************************/

function attachGaEvtTrackHomepage(selector, area, href){
	if(selector){
		selector.addEvents({
			'keypress': function(event){
				if(event.key){
					if(event.key == 'enter'){
						event.stop();
						this.fireEvent('click');
					}
				}
			},
			
			'click': function(event){
				if(event){ event.stop(); }
				if(pageTracker){
					pageTracker._trackEvent(area, 'Click', this.get('href'));
				} else if(typeof(window['_gaq']) != 'undefined'){
					_gaq.push(['_trackEvent', area, 'Click', this.get('href')]);
				}							
				this.blur();
				var a = this;
				if(!this.hasClass('lb')){
					setTimeout(function(){
						if(a.get('target')){
							if(a.get('target') == '_blank'){
								window.open(a.get('href'));
							} else {
								window.location.href = a.get('href');
							}
						} else {
							window.location.href = a.get('href');
						}
					}, 250);
				}
			}
		});
	
	} else if(href){
		if(pageTracker){
			pageTracker._trackEvent(area, 'Click', href);
		} else if(typeof(window['_gaq']) != 'undefined'){
			_gaq.push(['_trackEvent', area, 'Click', href]);
		}
	}
}

function handleHomepageBannerLink(href, type){
	if(type){
		if(type == 'lightbox'){
		} else if(type == 'target'){
		}
	} else {
		attachGaEvtTrackHomepage(false, 'Homepage Banner - Flash', href);
	}
}

function initGaEvtTrackHomepage(){
	if($('homepage-banner-enlarged')){
		attachGaEvtTrackHomepage($('homepage-banner-enlarged').getElements('.slide a'), 'Homepage Banner - AJAX');
	}
	
	if($('tab-1-links')){
		attachGaEvtTrackHomepage($('tab-1-links').getElements('a'), 'Homepage Top Links');
	}
	
	if($('featured')){
		$('featured').getElements('a').addClass('ajax');
		attachGaEvtTrackHomepage($('featured').getElements('a'), 'Homepage Carousel');
	}
	
	if($('sub-featured')){
		attachGaEvtTrackHomepage($('sub-featured').getElements('a'), 'Homepage Sub Links');
	}
}




/****************************************************
* Functions to Call when Homepage DOM is ready		*
*													*
*****************************************************/

function initHomepageDom(){
	if($('homepage-featured-items')){
		homepage_carousel_new = new HomepageCarousel($('homepage-featured-items'));
	}
}



/****************************************************
* Functions to Call when Homepage has loaded		*
*													*
*****************************************************/

function initHomepageLoad(){
	if($('homepage-banner-enlarged')){
		homepage_banner = new HomepageBanner($('homepage-banner-enlarged'));
	}
	
	initGaEvtTrackHomepage();
}


window.addEvent('domready', function() { initHomepageDom(); });
window.addEvent('load', function() { initHomepageLoad(); });