// m27
numOfLoadedImages = 0;
maxIncrementForLoadingImages = 10;
localCountOfImages = 0;
	
/* Extending MooTools with a jQuery style .closest() method */
Element.implement({
	closest: function(selector) {
		return $$(selector).contains(this) ? this : this.getParent(selector);
	}
});

/* Modal for the video */
var Modal = new Class({
	Implements: [Options, Events],
	
	options: {
		// onShow: $empty,
		// onContentload: $empty,
		// onContentclear: $empty,
		// onHide: $empty,
		id: "modal",
		closeText: "Close"
	},
	
	element: null,
	underlay: null,
	
	initialize: function(options) {
		this.setOptions(options);
		this.element = new Element('aside', {
			id: this.options.id
		});
		var close = new Element('a', {
			href: "#",
			text: this.options.closeText
		});
		close.addEvent('click', function(event) {
			this.close();
			event.stop();
		}.bind(this));
		close.inject(new Element('header').inject(this.element));
		new Element('article').inject(this.element);
		this.underlay = new Element('div', {
			id: this.options.id + '-underlay'
		});
		window.addEvent('resize', function() {
			this.center();
		}.bind(this));
	},
	
	load: function(url) {
		if ($(this.options.id)) {
			this.fireEvent('contentclear', url);
		}
		else {
			this.underlay.inject($(document.body));
			this.element.inject($(document.body));
			this.fireEvent('show', url);
		}
		
		var reqOptions = {
			url: url,
			onComplete: function() {
				this.element.removeClass('loading');
				this.center();
				if (Browser.ie7 || Browser.ie6) {
					this.center.delay(1000, this);
				}
				this.fireEvent('contentload', url);
			}.bind(this)
		};
		var hashNdx = url.indexOf('#');
		if (hashNdx > -1) {
			reqOptions.filter = url.substr(hashNdx);
			reqOptions.onSuccess = function(tree, els, html, js) {
				var article = this.element.getElement('article').empty();
				for (var i = tree.length; i--;) {
					$(tree[i]).inject(article, 'top');
				}
			}.bind(this);
		}
		else {
			reqOptions.update = this.element.getElement('article');
		}

		this.element.addClass('loading');		
		var req = new Request.HTML(reqOptions).send();
	},
	
	close: function() {
		this.element.dispose();
		this.underlay.dispose();
		this.fireEvent('hide');
	},
	
	center: function() {
		if (!($(this.options.id))) return;
		
		var modalSize = this.element.getSize();
		var winSize = this.underlay.getSize();
		
		var scroll = window.getScroll().y;
		
		var left = winSize.x / 2 - modalSize.x / 2;
		var top = (winSize.y / 2 - modalSize.y / 2) + scroll;
		
		if (left <= 0) { 
			left = 0;
		}
		if (top <= scroll) {
			top = scroll;
		}
		
		this.element.setStyles({
			'left': left + 'px',
			'top': top + 'px'
		});
	}
});

/* Slide, fade, fast switch */
var MooSlides = MooSlides || new Class({
	Implements: [Options, Events],
	
	options: {
		//onSlideChange: $empty,
		autoplay: true,
		hoverPause: true,
		initialSlide: 0,
		nextClass: 'next',
		nextText: 'Next',
		previousClass: 'previous',
		previousText: 'Prev',
		selectedLinkClass: 'selected',
		slideDuration: 10000,
		slideSelector: "section",
		transitionDuration: 300,
		transitionFunction: "sine:in:out",
		transitionType: "slide",
		wrapperClass: "slider-wrapper"
	},
	
	container: null,
	slides: null,
	activeIndex: 0,
	busy: false,
	previousLink: null,
	nextLink: null,
	links: [],
	pid: -1,
	
	
	
	initialize: function(container, options) {
		this.setOptions(options);
		this.container = container && $(container);
		this.slides = this.container.getElements(this.options.slideSelector);
		if (this.slides.length < 2) return;
		this.activeIndex = this.options.initialSlide;
		
		this.slides.each(function(el) {
			el.setStyles({
				position: "absolute",
				top: 0,
				left: "100%"
			});
		});
		this.slides[this.options.initialSlide].setStyle("left", "0%");
		
		var nav = new Element('nav');
		var ul = new Element('ul').inject(nav);
		
		new Element('a', {
			'class': this.options.previousClass,
			href: '#',
			events: {
				click: function(e) {
					this.previous();
					if (e) e.preventDefault();
				}.bind(this)
			},
			html: this.options.previousText
		}).inject(new Element('li').inject(ul));
		
		for (var i = 0; i < this.slides.length; i++) {
			this.links.push(new Element('span', {
				events: {
					click: function(e) {
						this.goToSlide($(e.target).retrieve('i'));
						e.preventDefault();
					}.bind(this)
				},
				html: i+1
			}).inject(new Element('a', {
				href: '#'
			}).inject(new Element('li').inject(ul))).store('i', i));
		}
		
		new Element('a', {
			'class': this.options.nextClass,
			href: '#',
			events: {
				click: function(e) {
					
					localCountOfImages = 0;				
					$$('.section-border').each(function(el) {			
						el.getElements('.section-wrapper ul li').each(function(a, i) {
								if(i+1>numOfLoadedImages && (localCountOfImages)<=maxIncrementForLoadingImages) // 
								{
									// insert image extension so image will load
									//a.closest('li').inject(ul);
									
									localCountOfImages++;
								}							
						});	
						numOfLoadedImages += localCountOfImages;	
					});
										
					this.next();
					e.preventDefault();
				}.bind(this)
			},
			html: this.options.nextText
		}).inject(new Element('li').inject(ul));
		
		this.links[this.activeIndex].parentNode.addClass(this.options.selectedLinkClass);
		this.slides.inject(new Element('div', {"class": this.options.wrapperClass}).inject(this.container, "top"));
		nav.inject(this.container, "top");
		
		if (this.options.autoplay) {
			this.pid = this.next.periodical(this.options.slideDuration, this);
			
			if (this.options.hoverPause) {
				this.container.addEvents({
					mouseenter: function(e) {
						window.clearInterval(this.pid);
					}.bind(this),
					mouseleave: function(e) {
						this.pid = this.next.periodical(this.options.slideDuration, this);
					}.bind(this)
				});
			}
		}
	},
	
	goToSlide: function(i, direction) {
		if (this.busy || i == this.activeIndex) return;
		
		var from = this.activeIndex;
		this.activeIndex = i;
		
		if (!direction) {
			var direction = from < i ? "right" : "left";
		}
		
		if (this.options.transitionType == "slide") {
			var options = {
				unit: "%",
				duration: this.options.transitionDuration,
				transition: this.options.transitionFunction
			};
			var fromFx = new Fx.Tween(this.slides[from], options);
			fromFx.addEvent('complete', function() {
				this.busy = false;
			}.bind(this));
			var toFx = new Fx.Tween(this.slides[i], options);
			this.busy = true;
			toFx.start('left', direction == "left" ? -100 : 100, 0);
			fromFx.start('left', 0, direction == "left" ? 100 : -100);
		}
		else if (this.options.transitionType == "fade") {
			this.slides[from].setStyle('z-index', '5');
			this.slides[i].setStyles({
				left: 0,
				"z-index": 4,
				opacity:0
			});
			var fromFx = new Fx.Tween(this.slides[from], options);
			fromFx.addEvent('complete', function() {
				this.busy = false;
			}.bind(this));
			var toFx = new Fx.Tween(this.slides[i], options);
			toFx.addEvent('complete', function() {
				this.element.setStyle('z-index', '6');
			});
			this.busy = true;
			fromFx.start('opacity', 1, 0);
			toFx.start('opacity', 0, 1);
		}
		else {
			this.slides[from].setStyle('left', '100%');
			this.slides[i].setStyle('left', '0');
		}
		
		this.links[from].parentNode.removeClass(this.options.selectedLinkClass);
		this.links[i].parentNode.addClass(this.options.selectedLinkClass);
		
		this.fireEvent("slideChange", [from, i, direction]);
	},
	
	previous: function() {
		this.goToSlide(this.activeIndex == 0 ? this.slides.length - 1 : this.activeIndex - 1, "left");
	},
	
	next: function() {
		this.goToSlide(this.activeIndex == this.slides.length - 1 ? 0 : this.activeIndex + 1, "right");
	}
});

/* Text expansion (Read More links) */
var TextExpand = TextExpand || new Class({
	Implements: [Options, Events],
	
	options: {
		lines: 5,
		readMoreText: "Read More",
		collapseText: "Collapse",
		collapseClass: "collapse",
		readMoreClass: "more",
		containerClass: "read-more-wrapper"
	},
	
	container: null,
	collapsedHeight: 0,
	originalHeight: 0,
	
	initialize: function(el, options) {
		this.setOptions(options);
		
		this.container = new Element('div', {"class": this.options.containerClass});
		this.container.adopt(el.getChildren(":not(img)")).inject(el);
		this.container.getElements('img').inject(this.container, 'before');
		this.collapsedHeight = this.options.lines * el.getStyle('line-height').toInt();
		this.originalHeight = this.container.getStyle('height').toInt();
		
		if (this.originalHeight <= this.collapsedHeight) return;
		
		this.container.setStyle('height', this.collapsedHeight);
		new Element('a', {
			href: "#",
			text: this.options.readMoreText,
			events: {
				click: function(e) {
					var t = $(e.target);
					t.toggleClass(this.options.collapseClass);
					if (t.hasClass(this.options.collapseClass)) {
						t.set('text', this.options.collapseText);
						this.container.setStyle('height', this.originalHeight);
					}
					else {
						t.set('text', this.options.readMoreText);
						this.container.setStyle('height', this.collapsedHeight);
					}
					e.preventDefault();
				}.bind(this)
			}
		}).inject(new Element('p', {"class" : this.options.readMoreClass}).inject(el));
	}
});

/* Click through elements */
var ClickThrough = ClickThrough || new Class({
	Implements: Options,
	
	options: {
		targetSelector: 'a',
		hoverClass: 'jsHover'
	},
	
	targets: null,
	element: null,
	activeTarget: null,
	
	initialize: function(element, options) {
		this.setOptions(options);
		this.targets = element.getElements(this.options.targetSelector);
		this.element = element;
		
		element.addEvent('mousemove', function(event) {
			var i = this.targets.length - 1, f = false;
			while (i >= 0 && !(f = this.hitTest(event, this.targets[i--])));
			this.element[f ? 'addClass' : 'removeClass'](this.options.hoverClass);
			this.activeTarget = f ? this.targets[i+1] : null;
		}.bind(this));
		
		element.addEvent('click', function(event) {
			if (this.activeTarget) {
				if (Browser.ie7) {
					this.activeTarget.click();
				}
				else {
					this.activeTarget.fireEvent('onclick');
				}
			}
		}.bind(this));
	},
	
	hitTest: function(event, subject) {
		var c = subject.getCoordinates();
		return ((c.left < event.page.x && event.page.x < c.right) && (c.top < event.page.y && event.page.y < c.bottom))
	}
});

window.addEvent('domready', function() {
	$$('.slider-container').each(function(el) {
		if (el.hasClass('fader')) {
			new MooSlides(el, { transitionType: 'fade' });			
		}
		else {
			new MooSlides(el);
		}
	});
	
	$$('.paged-nav').each(function(el) {
		if (el.getElements('ul').length > 1) {
			var initSlide = 0;
			el.getElements('.section-wrapper ul').each(function(s, i) {
				if (s.getElements('.selected').length) initSlide = i;
			});
			var m = new MooSlides(el.getElement('.section-wrapper'), {
				slideSelector: 'ul',
				autoplay: false,
				initialSlide: initSlide
			});
			if (el.hasClass('fader')) m.options.transitionType = 'fade';
			var nav = new Element('nav');
			var ul = new Element('ul');
			m.links.each(function(a) {
				a.closest('li').inject(ul);
			});
			ul.inject(nav.inject(el.getElement('h2'), 'after'));
		}
	});
	
	/*
	var replacedHeaders = $$('h2');
	replacedHeaders.each(function(el) {
		el.addClass('header-' + el.get('text').toLowerCase().replace(/ /g, "-"));
	});
	*/
	
	$$('.paged-nav .selected').each(function(el) {
		new Element('img', {
			'class': 'burst',
			alt: '',
			src: '/media/images/star-burst.png' 
		}).inject(el);
	});

	$$('.cta-block').each(function(el) {
		new TextExpand(el);
	});
	
	if (!window.globalModal) {
		globalModal = new Modal();
		$$('.modal-link').each(function(el) {
			el.addEvent('click', function(e) {
				globalModal.load(this.href);
				e.preventDefault();
			});
		});
	}

	if (Browser.ie7) {
		$$('.hero').each(function(el) {
			new ClickThrough(el);
		});
	}
});

window.addEvent('load', function() {
	var sidebar = $$('.nav-border').getParent();
	var hero = $$('.hero');
	
	if (sidebar.length) {
		sidebar[0].getElements('a').each(function(el) {
			if (el.getStyle('line-height') != el.getSize().y+"px") {
				el.addClass('two-line');
			}
		});
		sidebar.setStyle('top', '0');
	}
	
	if (sidebar.length && hero.length) {
		sidebar[0].getParent().setStyle('padding-top', (hero[0].getSize().y - sidebar[0].getSize().y) / 2 + 125);
	}
});