var gSlideShow, gSectionY, gPortsPhotoX, gPortLinkDivs, gPortLinkIndex;

YAHOO.util.Event.onDOMReady(init);

function init() {
	var i, link, pos;
	
	// replace the default anchor links
	var topNavs = YAHOO.util.Dom.getElementsByClassName('more', 'a', 'jump');
	gSectionY = new Array();
	for (i = 0; i < topNavs.length; i++) {
		link = YAHOO.util.Dom.getAttribute(topNavs[i], 'href');
		pos = link.lastIndexOf('#');
		link = link.substr(pos+1);
		gSectionY.push(YAHOO.util.Dom.getY(link));
		YAHOO.util.Event.addListener(topNavs[i], 'click', scrollToSection, i);
	}
	// replace back to top onclick behavior with animated scrolling
	var backNavs = YAHOO.util.Dom.getElementsByClassName('back', 'a');
	for (i = 0; i < backNavs.length; i++) {
		YAHOO.util.Event.addListener(backNavs[i], 'click', scrollToTop);
	}
	// get the ports photo X coodinate
	var portPhoto = document.getElementById('portPhoto');
	pos = YAHOO.util.Dom.getX(portPhoto);
	var photoImgs = portPhoto.getElementsByTagName('img');
	gPortsPhotoX = new Array();
	for (i = 0; i < photoImgs.length; i++) {
		gPortsPhotoX.push(YAHOO.util.Dom.getX(photoImgs[i])-pos);
	}
	// replace the port gallery switcher links
	var portNav = document.getElementById('portNav');
	gPortLinkDivs = portNav.getElementsByTagName('div');
	var portLinks = portNav.getElementsByTagName('a');
	for (i = 0; i < portLinks.length; i++) {
		YAHOO.util.Event.addListener(portLinks[i], 'click', portScroll, i);
	}
	gPortLinkIndex = 0;
	// initialize series tab
	seriesTabInit();
	// initialize gallery
	gSlideShow = new vsGallery();
}

function showFeature() {
	if (arguments.length > 0)
		var first = arguments[0];
	else
		var first = 0;
	gSlideShow.setSlides([ 'main_movie_touchpad.html' ],
						 [ 'images/main_mtb_touchpad.png' ],
						 [ 'Multi-finger Touchpad Demo' ], first);
	gSlideShow.show();
}

function scrollToSection(e, idx) {
	YAHOO.util.Event.stopEvent(e);
	var anim = new YAHOO.util.Scroll(document.body, { scroll: { to: [0, gSectionY[idx]] } }, 0.3, YAHOO.util.Easing.easeOut);
	anim.animate();
}

function scrollToTop(e) {
	YAHOO.util.Event.stopEvent(e);
	var anim = new YAHOO.util.Scroll(document.body, { scroll: { to: [0, 0] } }, 0.3, YAHOO.util.Easing.easeOut);
	anim.animate();
}

function portScroll(e, idx) {
	YAHOO.util.Event.stopEvent(e);
	var anim = new YAHOO.util.Scroll('portOuter', { scroll: { to: [gPortsPhotoX[idx], 0] } }, 0.5, YAHOO.util.Easing.easeOut);
	anim.animate();
	gPortLinkDivs[gPortLinkIndex].className = "";
	gPortLinkDivs[idx].className = "active";
	gPortLinkIndex = idx;
}