Object.extend(AC.MovieOverlay.prototype, {
	overlayShadowSrc: 'http://images.apple.com/retail/images/overlay_shadow_610_20080206.png',
	
	initialize: function(items, options) {
		this.items = items;
		
		if (this.items.length>0) {
			this.createOverlay();
			this.setDefaults();
			this.setItemAttributes();
		}

		this.options = options || {};

		if (location.hash) {
			var initial = location.hash.substring(location.hash.indexOf('#')+1, location.hash.length);
			this.showInitial(initial);
		}
	},
	
	buildContents: function() {
		this.titlePanel = Builder.node('h2', {'class':'overlaytitle'});
		this.displayPanel = Builder.node('div', {'class':'overlaymovie'});
		this.controllerPanel = Builder.node('div', {'class':'overlaycontroller'});
		this.descriptionPanel = Builder.node('div', {'class':'overlaydescription'});
		this.navPanel = Builder.node('div', { 'id':'overlaynav'});
		
		this.overlayContents = [
			this.closeBtn,
			this.titlePanel,
			this.descriptionPanel,
			this.navPanel,
			this.displayPanel,
			this.controllerPanel
		];
	},
	
	setItemAttributes: function() {
 		for (var i=0; i<this.items.length; i++) {
 			var item = this.items[i]; 

			item.movieLink = Element.down(item, 'a.overlaymovielink');
			item.movieUrl = item.movieLink.href;
			item.movieTitle = item.movieLink.title;
			item.title = item.movieLink.title.stripTags();
			item.movieLink.title = '';
			item.description = Element.down(item, '.overlaydescription');
			var posterFrame = Element.down(item, '.overlayposter');
			item.posterFrameUrl = posterFrame.innerHTML.match(/src="(.*)"/)[1];

 			this.setEvent(item, i);
 			
		}
		
	 	this.listenForEvent(this, 'beforePop', false, function(evt) {
			this.handleBeforePop(evt);
		}.bindAsEventListener(this));
		
		this.listenForEvent(this, 'afterPop', false, function(evt) {
			this.handleAfterPop(evt);			
		}.bindAsEventListener(this));
		
		this.listenForEvent(this, 'beforeClose', false, function(evt) {
			this.handleBeforeClose(evt);
		}.bindAsEventListener(this));
	},
	
	track: function(item, state) {
		if (state == 'Start') {
			this.order++;
		}

		var movieName = AC.Tracking.pageName() + ' - ';
		movieName += (item.title) ? item.title.stripTags() : item.movieUrl.match(/([^\/]+)\.\S\S\S$/)[1];
		if (state == 'Start') {
			movieName = 'V@S: ' + movieName + ' (US)';
			AC.Tracking.trackPage({
				pageName: movieName,
				prop4: item.movieUrl,
				prop13: movieName
			});
		} else if (state == 'End') {
			movieName = 'V@E: ' + movieName + ' (US)';
			AC.Tracking.trackClick({
				prop13: movieName
			}, this, 'o', movieName);
		}
	},

	showInitial: function(initial) {
		this.width = 50;
		this.left = this.windowSize().x+(this.windowSize().width/2);
		this.height = 50;
		this.top = this.windowSize().y+(this.windowSize().height/2)
		
		this.items.each(function(item, i) {
			if(item.id == initial) {
				this.prepPop(null, item, i);
			}
		}.bind(this));
	},
	
	handleAfterPop: function(evt) {
		// reset movie & static content
		var item = evt.event_data.data.item;
		var i = evt.event_data.data.i;
		this.packageMovie(item, i);
		if(item.down('.overlaydescription')) this.descriptionPanel.innerHTML = item.description.innerHTML;
		this.titlePanel.innerHTML = item.movieTitle;
	}
});

MovieGalleryOverlay = Class.create();
Object.extend(MovieGalleryOverlay.prototype, AC.MovieOverlay.prototype);
Object.extend(MovieGalleryOverlay.prototype, {
	
	setItemAttributes: function() {
 		for (var i=0; i<this.items.length; i++) {
 			var item = this.items[i]; 

			item.movieLink = Element.down(item, 'a.overlaymovielink');
			item.movieUrl = item.movieLink.href;
			item.movieTitle = item.movieLink.title;
			item.title = item.movieLink.title.stripTags();
			item.movieLink.title = '';
			item.description = Element.down(item, '.overlaydescription');
			var posterFrame = Element.down(item, '.overlayposter');
			item.posterFrameUrl = posterFrame.innerHTML.match(/src="(.*)"/)[1];
			
			item.nav = this.getNav(item);
			
 			this.setEvent(item, i);
 			
		}
		
	 	this.listenForEvent(this, 'beforePop', false, function(evt) {
			this.handleBeforePop(evt);
		}.bindAsEventListener(this));
		
		this.listenForEvent(this, 'afterPop', false, function(evt) {
			this.handleAfterPop(evt);			
		}.bindAsEventListener(this));
		
		this.listenForEvent(this, 'beforeClose', false, function(evt) {
			this.handleBeforeClose(evt);
		}.bindAsEventListener(this));
	},
	
	getNav: function(item) {
		var wrapper = item.up('.gallerywrapper');
		var siblings = wrapper.select('.watchtutorial');
		var items = [];
		for(var i=0; i<siblings.length; i++) {
 			var cloned = siblings[i].cloneNode(true);
			cloned.select('img')[0].src = cloned.select('img')[0].src.replace(/thumb/, 'thumb_overlay');
			cloned.select('img')[0].width = 130;
			cloned.select('img')[0].height = 73;
			
			cloned.appendChild(Builder.node('span', {'class':'movietitle'}, cloned.select('.caption')[0].innerHTML));
 			if (item == siblings[i]) Element.addClassName(cloned, 'active')
	 		items.push(cloned);
		}
		var list = Builder.node('ul', items);
		return list;
	},
	
	setNav: function(item, i) {		
		this.navPanel = $(this.navPanel);
		this.navPanel.innerHTML = '';
		this.navPanel.insert(item.nav);
		var items = this.navPanel.select('.watchtutorial');
		for(var j=0; j<items.length; j++) {
			Event.observe(items[j], 'click', this.swapMovie.bindAsEventListener(this, items[j], j, i));
		}
	},
	
	swapMovie: function(evt, item, j, i) {
		Event.stop(evt);
		var items = this.navPanel.select('.watchtutorial');
		for(var k=0; k<items.length; k++) {
			if(k == j) {
				items[k].addClassName('active');
			} else {
				items[k].removeClassName('active');
			}
		}
		item.movieUrl = item.down('.overlaymovielink').href;
		item.title = (Element.down(item, 'img')) ? Element.down(item, 'img').alt : item.innerHTML.stripTags();
		if (!AC.Detector.isMobile()) {
			if (this.movieController) this.movieController.SetURL(item.movieUrl);
			this.track(item, 'Start');
		} else {
			this.displayPanel.innerHTML = '';
			item.posterFrameUrl = item.down('.posterframe').innerHTML;
			this.packageMovie(item);
		}
		if(item.down('.caption')) this.titlePanel.innerHTML = item.down('.caption').innerHTML;
		if(item.down('.description')) this.descriptionPanel.innerHTML = item.down('.description').innerHTML;
	},
	
	prepPop: function(evt, item, i) {
		this.setNav(item, i);
		// call the effect
		this.pop(this.defaultWidth, this.setPopPosition().top, this.defaultHeight, this.setPopPosition().left, item, i);
 	}
 	
});

ImageGalleryOverlay = Class.create();
Object.extend(ImageGalleryOverlay.prototype, AC.Overlay.prototype);
Object.extend(ImageGalleryOverlay.prototype, {
	overlayId: 'imageGalleryOverlay',
	overlayShadowId: 'imageGalleryOverlayShadow',
	overlayShadowSrc: 'http://images.apple.com/finalcutstudio/images/overlay_shadow_626_20080206.png',
	
	
	buildContents: function() {
		this.titlePanel = Builder.node('h2', { 'class':'overlaytitle' });
		this.img = Builder.node('img', {height:360, width:640, border:0});
		this.captionPanel = Builder.node('div', { 'class':'overlaycaption' });
		this.descriptionPanel = Builder.node('div', { 'class':'overlaydescription' });
		this.navPanel = Builder.node('div', { 'id':'overlaynav'});
		this.overlayContents = [
			this.closeBtn,
			this.titlePanel,
			this.img,
			this.captionPanel,
			this.descriptionPanel,
			this.navPanel
		];
	},
	setItemAttributes: function() {
 		for (var i=0; i<this.items.length; i++) {
 			var item = this.items[i];
			item.nav = this.getNav(item);
 			this.setEvent(item, i);
			
		}
	},
	getNav: function(item) {
		var wrapper = Element.up(item, 'ul');
		var siblings = wrapper.select('.overlaythumb');
		var items = [];
		for(var i=0; i<siblings.length; i++) {
 			var cloned = siblings[i].cloneNode(true);
			if(wrapper.hasClassName('customthumbs')) {
				cloned.select('img')[0].src = cloned.select('img')[0].src.replace(/thumb/, 'thumb_overlay');
				cloned.select('img')[0].width = 130;
				cloned.select('img')[0].height = 73;
			}
 			if (item == siblings[i]) Element.addClassName(cloned, 'active')
	 		items.push(cloned);
		}
		var list = Builder.node('ul', items);
		return list;
	},
	setNav: function(item, i) {		
		this.navPanel = $(this.navPanel);
		this.navPanel.innerHTML = '';
		this.navPanel.insert(item.nav);
		var items = this.navPanel.select('.overlaythumb');
		for(var j=0; j<items.length; j++) {
			Event.observe(items[j], 'click', this.swapImage.bindAsEventListener(this, items[j], j, i));
		}
		
		this.overlayShadow = $(this.overlayShadowId);
	},
	swapImage: function(evt, item, j, i) {
		Event.stop(evt);
		var items = this.navPanel.select('.overlaythumb');
		for(var k=0; k<items.length; k++) {
			if(k == j) {
				items[k].addClassName('active');
			} else {
				items[k].removeClassName('active');
			}
		}
		this.titlePanel.innerHTML = item.down('a.overlayimglink').title;
		this.img.src = item.down('a.overlayimglink').href;
		if(item.down('.caption')) this.captionPanel.innerHTML = item.down('.caption').innerHTML;
		if(item.down('.description')) this.descriptionPanel.innerHTML = item.down('.description').innerHTML;

		// biggest hack ever
		this.overlayShadow.style.borderBottom = '1px solid #fff';
		function fixBorder() {
			this.overlayShadow.style.borderBottom = '';
		}
		AC.Tracking.trackClick({prop1: ''}, this.img.src, 'o', AC.Tracking.pageName() + ' - '+item.down('img').title.stripTags());
		setTimeout(fixBorder.bind(this), 1);
	},

 	prepPop: function(evt, item, i) {
		this.setNav(item, i);
		item.imgLink = item.down('a.overlayimglink');

		this.titlePanel.innerHTML = item.imgLink.title;
		this.img.src = item.imgLink.href;
		item.imgShortLink = item.imgLink.href.substring(item.imgLink.href.lastIndexOf('/')+1, item.imgLink.href.length);
		
		if(item.down('.caption')) this.captionPanel.innerHTML = item.down('.caption').innerHTML;
		if(item.down('.description')) this.descriptionPanel.innerHTML = item.down('.description').innerHTML;
		AC.Tracking.trackClick({prop1: ''}, this.img.src, 'o', AC.Tracking.pageName() + ' - '+item.imgLink.title.stripTags());
		// call the effect
		this.pop(this.defaultWidth, this.setPopPosition().top, this.defaultHeight, this.setPopPosition().left, item, i);
 	}
});

var PrintsOverlay = Class.create();
Object.extend(Object.extend(PrintsOverlay.prototype, AC.HTMLOverlay.prototype), {
	overlayId: 'PrintsOverlay',
	overlayShadowId: 'PrintsOverlayShadow',
	overlayShadowSrc: 'http://images.apple.com/finalcutstudio/images/overlay_shadow20080206.png',
	
	setEvent: function(item, i) {
		Event.observe(item.down('.overlaylink'), 'click', this.onClick.bindAsEventListener(this, item, i), false);
	},
	
	handleAfterPop: function(evt) {
		// reset content
		var item = evt.event_data.data.item;
		var i = evt.event_data.data.i;
		this.descriptionPanel.innerHTML = item.description.innerHTML;
		
		$$('#PrintsOverlay .slider').each(function(item) {
			item.id += '-overlay';
		});
		
		// sliders
		if($('slider-books1-overlay')) new slider('slider-books1-overlay');
		if($('slider-books2-overlay')) new slider('slider-books2-overlay');
		if($('slider-books3-overlay')) new slider('slider-books3-overlay');
		if($('slider-books4-overlay')) new slider('slider-books4-overlay');
		// gallery init
		var booksSwapNav = $$('#PrintsOverlay .nav a.swapnav');
		var booksSwapWrapper = $$('#PrintsOverlay .mainarea .swapcontent')[0];
		var booksSwapImage = $$('#PrintsOverlay .mainarea .swapimage')[0];
		var booksSwapImageNav = $$('#PrintsOverlay .mainarea .swapimagenav')[0];
		if (booksSwapNav.length>0 && booksSwapWrapper && booksSwapImage && booksSwapImage) {
			var booksSwap = new Gallery(booksSwapNav, 'info', 'images', booksSwapWrapper, booksSwapImage, booksSwapImageNav);
			booksSwap.showContent(null, 0);
		}
		// tabs init
		if ($$('#PrintsOverlay .books-tabnav').length>0 && $$('#PrintsOverlay .books-tabcontent').length>0) {
			var bookstabswap = new ContentSwap('#PrintsOverlay .books-tabnav', '#PrintsOverlay .books-tabcontent', 'click', booksSwap);
		}
		
	}
});
