if (typeof(FOH) == "undefined") FOH = {};





FOH.SwapItem = Class.create({

	initVariables: function() {
		this.triggers = [];
		this.title = null;
		this.video = {
			url: null,
			poster: null,
			end: null
		};
		this.content = null;
		this.gallery = null;
		this.itunes = null;
		
		this.docTitle = document.title;
	},

	initialize: function(section) {
		this.initVariables();

		section = $(section);
		this.triggers = [section];
		this.title = section.down('a').innerHTML.stripTags().strip();

		// category
		this.category = '';
		if (section.up('.category').down('h4')) {
			if (section.up('.category').down('h4')) this.category += section.up('.category').down('h4').innerHTML.stripTags().strip()+' - ';
		} else {
			this.category += section.up('.category').previous('h4').innerHTML.stripTags().strip()+' - ';
			if (section.up('.category').down('h5')) this.category += section.up('.category').down('h5').innerHTML.stripTags().strip()+' - ';
		}

		this.id = section.identify();

		var link = section.down('a') || section;
		if (link.href.match(/\.mov/)) {
			this.video = {
				url: section.down('a').href,
				end: (section.down('.endstate')) ? section.down('.endstate').innerHTML : ''
			}
		}

		if (section.down('.gallery')) {
			this.gallery = section.down('.gallery').innerHTML.strip();
		}

		if (section.down('.itunes')) {
			this.itunes = section.down('.itunes').href;
		}

		if (section.down('.content')) {
			this.content = section.down('.content').innerHTML.strip();
		}

		if (section.up('div.tabswap')) {
			this.tab = section.up('div.tabswap');
		}

		link.href = '#';
		if (this.tab) link.href += 'tab='+this.tab.identify()+'&';
		link.href += 'tutorial='+this.id+'&';
		link.href = link.href.substring(0, link.href.length-1)
		
		this.setHover(0);
		this.setClick(0);
	},
	
	setHover: function(i) {
		var trigger = this.triggers[i];

		Event.observe(trigger, 'mouseover', function() {
			trigger.addClassName('hover');
		}, false);

		Event.observe(trigger, 'mouseout', function() {
			trigger.removeClassName('hover');
		}, false);
	},
	
	setClick: function(i) {
		var trigger = this.triggers[i];

		Event.observe(trigger, 'click', function(evt) {
			if (!AC.Detector.isOpera()) {
				if (evt) {
					var target = evt.findElement('a[href]');
					if (target && !target.href.match('#')) Event.stop(evt);
				}

 				this.dispatchEvent('activate', this);
			}
		}.bind(this), false)
	},

	addTrigger: function(trigger) {
		this.triggers.push(trigger);

		this.setHover(this.triggers.length-1);
		this.setClick(this.triggers.length-1);
	},

	activate: function(tracking) {
		document.title = this.docTitle+' - '+this.category+this.title;
		this.trackClick(tracking);

		this.visited();
		
		this.triggers.each(function(trigger) {
			trigger.addClassName('active');
		});
	},
	
	deactivate: function() {
		this.triggers.each(function(trigger) {
			trigger.removeClassName('active');
		});
	},

	visited: function() {
		this.triggers.each(function(trigger) {
			if (!trigger.hasClassName('visited')) trigger.addClassName('visited');
		});
	},

	trackClick: function(custom) {
		var options = {};
		var url = document.location.toString().replace(/#.*/, '');
		
		// prop4 = url
		if (custom.toString().match(/gallery/i)) {
			options.prop4 = url + '#tutorial='+this.id+'&gallery';
		} else if (this.video.url) {
			options.prop4 = this.video.url;
		} else if (this.gallery && this.id) {
			options.prop4 = url + '#tutorial='+this.id;
		}
		
		if (this.tab) {
			var section = document.title.toString().match(/Apple - Find Out How - ([^-]*)/i)[1].toLowerCase().strip();
			var tab = this.tab.identify().toLowerCase().strip();
			options.prop2 = 'www.us.findouthow.'+section+'.'+tab;
		}

		// prop6, prop13 = link type + state
		var string = '';
		if (typeof(custom) != 'boolean') {
			string += custom+': ';
		} else if (this.video.url) {
			string += 'V@S: ';
		} else if ((this.content!=null)&&(typeof(custom) == 'boolean')){
			string += 'Text: ';
		}
		string += AC.Tracking.pageName() + ' - ' + this.id;
		string += ' (PT)';

		options.pageName = string;
		options.prop13 = string.replace(/Apple - |\(PT\)/g, '');
	
		// try { console.log(options.pageName); } catch(e) {}
		// try { console.log(options.prop2); } catch(e) {}
		// try { console.log(options.prop4); } catch(e) {}
		// try { console.log(options.prop6); } catch(e) {}
		// try { console.log(options.prop13); } catch(e) {}
		AC.Tracking.trackPage(options);
	}

});
Object.extend(FOH.SwapItem.prototype, Event.Publisher);





FOH.Swap = Class.create();
Object.extend(FOH.Swap.prototype, Event.Listener);
Object.extend(FOH.Swap.prototype, {

	initVariables: function() {
		this.sections = {};
		this.initialized = false;
		this.currentSection = null;
		this.currentController = null;
		this.panels = {
			wrapper: null,
			movie: null,
			controller: null,
			end: null,
			html: null
		};

		this.cookies = new FOH.Cookies();
	},

	initialize: function(sections, extraSectionTriggers, tabs, panels) {
		this.initVariables();

		var extraSectionTriggers = this.setExtraTriggersInfo(extraSectionTriggers);
		this.setSections(sections, extraSectionTriggers);

		this.tabs = tabs;
		for (panel in panels) this.panels[panel] = $(panels[panel]);

		this.panels.video.gallery.back.observe('click', this.showCurrent.bind(this));
		this.panels.video.gallery.trigger.observe('click', this.showCurrentGallery.bind(this));

		this.panels.video.end.replay.observe('click', this.replayCurrent.bind(this));

		// for IE
		Event.observe(window, 'unload', function() {
			this.currentController = null;
			this.currentMovie = null;
		}.bind(this));
	}, 
	
	setExtraTriggersInfo: function(triggers) {
		triggers.each(function(trigger, i) {
			var id = trigger.down('a') || trigger;
			id = id.href.replace(/.*#/, '');
			id = id.toQueryParams();
			id = id.tutorial;

			triggers[i].writeAttribute({ 'compareId':id });
		});

		return triggers;
	}, 
	
	setSections: function(sections, extraSectionTriggers) {
		for (var i=0; i<sections.length; i++) {
			var section = new FOH.SwapItem(sections[i]);
			if (this.cookies.data.indexOf(section.id)>-1) section.visited();

			for (var j=0; j<extraSectionTriggers.length; j++) {
				if (section.id == extraSectionTriggers[j].readAttribute('compareId')) {
					if (j==0) this.firstSection = section;
					section.addTrigger(extraSectionTriggers[j]);
				}
			}

			this.setListener(section);
			this.sections[section.id] = section;
		}

		this.lastSection = this.firstSection;
		this.currentSection = this.firstSection;
	}, 
	
	setListener: function(section) {
		this.listenForEvent(section, 'activate', false, function(evt) {
			var section = evt.event_data.data;
			this.show(section, false);
		});
	},

	showVideo: function(section, checkUrl) {
		this.panels.wrapper.className = 'movie';
		
		if (this.currentController && !this.currentController.movie) this.onMovieShow = setTimeout(this.showVideo.bind(this, section), 100);
		if (this.currentController && this.currentController.movie) {
			if (this.currentUrl != section.video.url) {
				this.currentController.SetURL(section.video.url);
				this.currentUrl = section.video.url;
			}
			
			if (!this.currentController.isPlaying()) {
				this.currentController.Play();
				if (!this.onMovieShow) this.onMovieShow = setTimeout(this.showVideo.bind(this, section), 100);
			}

			var onMovieFinished = function(section) {
				this.currentController.options.onMovieFinished = this.showEndFrame.bind(this, section);
			}.bind(this, section)
			this.onMovieFinished = setTimeout(onMovieFinished, 1000);
		}

		this.showVideoGalleryLink(section);
		this.showiTunesLink(section);
	},

	showiTunesLink: function(section) {
		this.panels.video.itunes.trigger.href = section.itunes;
		this.panels.video.itunes.trigger.style.display = section.itunes ? 'block' : 'none';
	},

	showVideoGalleryLink: function(section) {
		if (section.gallery) {
			this.panels.video.gallery.back.href = '#tutorial='+section.id;
			if (section.tab) this.panels.video.gallery.back.href = this.panels.video.gallery.back.href.replace('#', '#tab='+section.tab.identify()+'&');

			this.panels.video.gallery.trigger.href = '#tutorial='+section.id+'&gallery';
			if (section.tab) this.panels.video.gallery.trigger.href = this.panels.video.gallery.trigger.href.replace('#', '#tab='+section.tab.identify()+'&');

			this.panels.video.gallery.trigger.style.display = 'block';
		}
	},

	showGallery: function(section) {
		if (section.gallery) {
			this.panels.wrapper.className = 'gallery';

			this.hideVideo(true);
			this.hideGallery();
			this.hideText();

			this.panels.video.gallery.display.insert(section.gallery);
			new FOH.Gallery(this.panels.video.gallery.display);
		}
	},

	showCurrentGallery: function() {
		this.showGallery(this.currentSection);

		this.currentSection.trackClick('Gallery');
	},

	showEndFrame: function(section) {
		this.panels.wrapper.className = 'endstate';
		this.panels.video.end.display.insert(section.video.end);

		this.trackEndFrame(section);
	},

	trackEndFrame: function(section) {
		var options = {};
		
		var string = 'V@E: ';
		string += AC.Tracking.pageName() + ' - ' + section.id;

		AC.Tracking.trackClick({ prop13:string }, this, 'o', string);
	},

	showText: function(section) {
		this.panels.wrapper.className = 'tips';

		this.panels.text.update(section.content);
		if (section.gallery) new FOH.Gallery(this.panels.text);
	},

	showCurrent: function() {
		this.show(this.currentSection, true);
	},

	showById: function(sectionId, gallery) {
		var section = this.sections[sectionId];

		if (section) {
			if (gallery && section.gallery) {
				this.show(this.sections[sectionId], 'Gallery');
			} else {
				this.show(this.sections[sectionId], false);
			}
		} else {
			this.showFirst();
		}
	},

	showLast: function() {
		if (this.lastSection) {
			this.show(this.lastSection, true);
		} else {
			this.showCurrent();
		}
	},

	showFirst: function() {
		this.showVideoGalleryLink(this.firstSection);
		this.showiTunesLink(this.firstSection);
		
		if (this.tabs && this.firstSection.tab) this.tabs.showContent(this.firstSection.tab);

		// fake a controller here...
		var fakeController = new AC.QuicktimeController();
		fakeController.render(this.panels.video.controller);
		fakeController = null; // for IE

		this.panels.video.controller.down('.control').observe('click', this.show.bind(this, this.firstSection, false));
	},

	show: function(section, force) {
		if (!this.initialized || force || this.currentSection != section) {
			
			if ((!this.initialized || !force) && this.currentSection) this.hide(this.currentSection);

			section.activate(force);
			this.cookies.set(section.id);

			if (this.tabs && section.tab) this.tabs.showContent(section.tab);
			
			this.showiTunesLink(section);
			if (force == 'Gallery') {
				this.showVideoGalleryLink(section);
				this.showGallery(section);
			} else if (section.video.url != null) {
				if (!this.currentController) this.setUpMovieAndController(section);
				this.showVideo(section, section.video.url);
			} else if (section.content != null) {
				this.showText(section);
			}
			
			if (!this.initialized) this.initialized = true;
		}
		
		this.currentSection = section;
		if (section.video.url || section.gallery) this.lastSection = section;
	},
	
	replayCurrent: function() {
		this.show(this.currentSection, 'V@R');
	},

	hide: function(section) {
		section.deactivate();
		
		this.hideVideo();
		this.hideGallery();
		this.hideText();
	},

	hideVideo: function(keepUrl) {
		if (this.onMovieFinished) this.onMovieFinished.clearTimeout;
		if (this.onMovieShow) this.onMovieShow.clearTimeout;

		if (this.currentController) {
			this.currentController.options.onMovieFinished = null;
			this.currentController.Stop();
			// TODO: this....
			// if (!keepUrl && this.currentController.movie) {
			// 	this.currentController.SetURL('http://images.apple.com/global/elements/blank.gif');
			// 	this.currentUrl = 'http://images.apple.com/global/elements/blank.gif';
			// }
		}

		this.panels.video.end.display.update('');
	},

	hideGallery: function() {
		this.panels.video.gallery.display.update('');
		this.panels.video.gallery.trigger.style.display = '';
	},
	
	hideText: function() {
		this.panels.text.update('');
	},

	setUpMovieAndController: function(section) {
		var movie = AC.Quicktime.packageMovie('frpm-object', section.video.url, {
			width: 640,
			height: 400,
			autoplay: true,
			controller: false,
			cache: true
		});
		this.panels.video.display.appendChild(movie);
		
		if (AC.Detector.isValidQTAvailable('7')) {
			this.currentController = new AC.QuicktimeController();
			
			this.panels.video.controller.update('');
			this.currentController.render(this.panels.video.controller);
			
			this.currentController.attachToMovie(movie, { 
				onMoviePlayable: function() {
					this.monitorMovie();
				}.bind(this.currentController)
			});
		}
		
		movie = null; // for IE
	}

});