var TourNav = Class.create();
Object.extend(Object.extend(TourNav.prototype, PopupGalleryMovie.prototype), {

 	createPopup: function() {
		this.closeBtn = Builder.node('a', {href:'#close', 'class':'close'}, 'Close');
		Event.observe(this.closeBtn, 'click', this.close.bindAsEventListener(this), false);

		this.displayPanel = Builder.node('div', {'class':'movie'});
		this.controllerPanel = Builder.node('div', {'class':'controller'});
		this.descriptionPanel = Builder.node('div', {'class':'description'});

		this.popup = Builder.node('div', {'id':'popupmovie', 'class':'popup'}, [
			this.closeBtn,
			this.descriptionPanel,
			this.displayPanel,
			this.controllerPanel
		]);

 		this.popupshadow = Builder.node('div', {id:'popupmovieshadow', 'class':'popupshadow'}, [
 			Builder.node('img', {src:'/business/macatwork/images/popup_movieshadow_nav20081005.png', alt:'', border:0})
 		]);

 		document.body.appendChild(this.popupshadow);
 		document.body.appendChild(this.popup);
 	},
	
 	onClick: function(evt, item, i) {
 		// store the small size and position for later
		this.width = (item.offsetWidth>80) ? 80 : item.offsetWidth;

		this.left = evt.pageX || evt.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
		this.left -= this.width/2;
		this.left = this.left || document.body.getDimensions().width / 2;
		this.height = item.offsetHeight;
		this.top = evt.pageY || evt.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
		this.top -= this.height/2;
		
		if (AC.Detector.isiPhone()) {
		    this.left = 3;
			this.top = 200;
		}
		
		// stop the default event
 		Event.stop(evt);

		// track this click
	 	if (item.trackClick) item.trackClick();

		// unset the click events if a movie
		if (!this.controllerPanel.innerHTML == "") {
			this.beforeClose();
			this.afterClose();
		}

		// do the image
		this.prepPop(evt, item, i);
 	},

	movieLinks: function(item, i) {
 		if (AC.Detector.isOpera()) {
 			this.previous = true;
 			this.next = true;
 		} else {
			if (!this.next && !this.previous) {
				this.previous = Builder.node('a', {'class':'previous'}, 'Previous');
				this.next = Builder.node('a', {'class':'next'}, 'Next');
				var links = Builder.node('div', {'class':'links'}, [this.previous, this.next]);
				this.controllerPanel.parentNode.appendChild(links);
			}
			this.setMovieLinks(i);
		}
	},

	setMovieLinks: function(i) {
		var pindex = (i==0) ? this.items.length-1 : i-1;
		var previous = this.items[pindex];
		this.previous.innerHTML = previous.title;	
		this.previous.href = previous.movieUrl;
		this.previous.onclick = function(e) {
			this.descriptionPanel.innerHTML = previous.description.innerHTML;
			if (this.movieController) this.movieController.SetURL(previous.movieUrl);
			this.setMovieLinks(pindex);
			this.currentItem = previous;
			this.track(previous, "Start");
			return false;
		}.bind(this, previous, pindex)

		var nindex = (i==this.items.length-1) ? 0 : i+1;
		var next = this.items[nindex];
		this.next.innerHTML = next.title;
		this.next.href = next.movieUrl;
		this.next.onclick = function(e) {
			this.descriptionPanel.innerHTML = next.description.innerHTML;
			if (this.movieController) this.movieController.SetURL(next.movieUrl);
			this.setMovieLinks(nindex);
			this.currentItem = next;
			this.track(next, "Start");
			return false;
		}.bind(this, next, nindex)
	},

 	afterPop: function(item, i) {
		Element.removeClassName(this.popup, 'isanim');
		Element.removeClassName(this.popupshadow, 'isanim');
		Element.addClassName(this.popup, 'popped');
		Element.addClassName(this.popupshadow, 'popped');
		
		// movie & static content
		this.packageMovie(item, i);
		this.descriptionPanel.innerHTML = item.description.innerHTML;
		this.movieLinks(item, i);

		// reset the effect inline styles
		this.popup.style.width = '';
		this.popupshadow.style.width = '';

		this.popup.style.height = '';
		this.popupshadow.style.height = '';

		Element.setOpacity(this.popup, '');
		Element.setOpacity(this.popupshadow, '');
 	}

});