// kicks.js 
// @author adam.housman
//
// JS for kicks.html

var JQ = jQuery.noConflict();

// --------
// GENERAL FUNCTIONS
// --------

// initialize rollovers (all images w/ class "button")
function initButtons(){
	JQ(".button").each( function(){
		var up = JQ(this).attr('src');
		var over = up.split('.jpg')[0]+'_over.jpg';
		JQ(this).mouseout(function(){
		  JQ(this).attr({'src':up});
		}).mouseover(function(){
		  JQ(this).attr({'src':over});
		});
		
		// Preload these rollover images
		JQ("body").append('<img src="'+over+'" alt="" class="preloader" />');
	});
}

// transition - fades between images by changing the background-image of the container.
function transition(nextImage,containerName,speed){
	var container = "#"+containerName;
	var image = container+" img.slideshow-image";
	JQ(container).css({ "background-image": "url(" + nextImage + ")" });
	JQ(image).fadeOut(speed, function(){
		JQ(image).attr({'src': nextImage});
		JQ(image).fadeIn(speed);
	});
}

// --------
// PRODUCT GALLERY FUNCTIONS
// --------

JQ(document).ready(function() {
	//For each thumbnail: Capture href, then assign 'transition' to the click event.
	JQ("#product-thumbs ul li a").each(function(){
		var imgHref = JQ(this).attr('href');
		JQ(this).attr({'href': 'javascript:void(0);'});
		JQ(this).click(function() {
			if (JQ("#product-container").is(':animated') || JQ("#product-container img.slideshow-image").is(':animated')){
			} else { 
				JQ(this).addClass('selected').parent().siblings().find('a').removeClass('selected'); //Add selected class and remove all other thumbnail links' selected class.
				transition(imgHref,"product-container",350);
			}
		});
	});
});

// --------
// ATHLETES GALLERY FUNCTIONS
// --------

// AthleteProfile(xmlFile)
// Sets up all profiles to expand and contract on click. 
// Pre-selects the default player profile.
// Displays Athletes' shoes from pageConfig.xml w/ ajax.
function AthleteProfile(xmlFile){
	this.init = function(){
		JQ("#athletes-scroller ul li p.name a").attr({'href':'javascript:void(0)'}).click( function(){
			var name = JQ(this).attr('rel');
			if(JQ(this).parents('li').is('.selected')){} else {
				if((JQ.browser.msie)&&(parseInt(JQ.browser.version)<=6)){ //IE6 and under - minimal animation
					JQ('.selected').removeClass('selected').find("p:not(.name)").hide();
					JQ(this).parent().parent().parent().parent().parent().addClass('selected');
					JQ(this).parent().parent().find('p').show();
				} else { //All other browsers
					JQ('li.selected').css({"padding": 0})
						.find('div.middle p.team, div.middle p.profile_link').fadeOut().end()
						.find('div.middle p.name a').css({
							"font-weight": "normal",
							"color": '#969696'
						}).end().find('div.middle').animate({
							"height": "17px"
						}, 500).end().find('div.top, div.middle, div.bottom').css({
							"background-image": "none",
							"background-color": "transparent",
							"padding-top": 0,
							"padding-bottom": 0
						}).end().find('div.faux-background').css({"top":"-4px"}).fadeOut(500).end();
						JQ('li.selected').removeClass('selected');
					JQ(this).parents('li').css({
						"padding": "4px 0 6px"
					}).find('div.faux-background').css({"top":"4px"}).fadeIn(500)
						.end().find('div.top').css({
							"background": "#fff url(/nikebasketball/us/en_US/images/kicks/athletes/nav/selected_athlete_bg_top.jpg) center top no-repeat",
							"padding-top": "7px"
						}).end().find('div.bottom').css({
							"background": "#fff url(/nikebasketball/us/en_US/images/kicks/athletes/nav/selected_athlete_bg_bottom.jpg) center bottom no-repeat",
							"padding-bottom": "7px"
						}).end().find('div.middle').css({
							"background-color": "#e2e5e5"
						}).animate({
							"height": "57px"
						}).find('p.name a').css({
							"font-weight": "bold",
							"color": "#393939"
						}).end().find('p.team, p.profile_link').fadeIn(500).end()
					.end().addClass('selected');
				}
	
				// CHANGE ATHLETE PHOTO
				if (JQ.browser.msie){ // IE7 doesn't like to fadeOut transparent pngs,
					if (parseInt(JQ.browser.version) < 7){
						JQ("#athletes-photo").get(0).style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/nikebasketball/us/en_US/images/kicks/athletes/"+name+".png', sizingMethod='scale')";
						// JQ("#athletes-photo").css({backgroundImage:'/nikebasketball/us/en_US/images/kicks/athletes/'+name+'.png'});
					} else {
						JQ("#athletes-photo").attr({'src':'/nikebasketball/us/en_US/images/kicks/athletes/'+name+'.png'});
					}
				} else { // Other browsers do.
					JQ("#athletes-photo").fadeOut(200);
					setTimeout(function(){
						JQ("#athletes-photo").attr({'src':'/nikebasketball/us/en_US/images/kicks/athletes/'+name+'.png'}).fadeIn(300);
					}, 200);
				}
				
				// CHANGE SHOE PHOTOS iff ATHLETE HAS SHOES
				JQ("#athletes-shoes-scroller ul").empty();
				if (JQ(this).parents('li.selected').hasClass('hasShoes')){
					//getShoesFromXML(name);
					getShoesFromHTML(name);
				}
			}
		});
	}
	JQ("#athletes-scroller ul li:not(.selected)").each(function(){
		JQ(this).find("p:not(.name)").toggle();
	});
	
	var getShoesFromHTML = function(name){
		var XHTML = JQ("#shoelist_"+name).html();
		JQ("#athletes-shoes-scroller ul").html(XHTML).css({'top':'1px'});
	}
	
	var getShoesFromXML = function(name){
		JQ.ajax({
			url: '/nikebasketball/us/en_US/xml/'+xmlFile,
			type: 'GET',
			dataType: 'xml',
			timeout: 1000,
			error: function(){
			},
			success: function(xml){
				var XHTML = '';
				JQ(xml).find('athlete[id="'+name+'"] shoes shoe').each(function(){
					XHTML = XHTML + '<li><img src="'+JQ(this).text()+'" alt="" /></li>';
				});
				JQ("#athletes-shoes-scroller ul").html(XHTML).css({'top':'1px'});
				athletesShoesScroller = new Scroller("athletes-shoes",60);
				athletesShoesScroller.init();
			}
		});
	}
}

// Scroller(id, speed)
// Takes id prefix of the scroll container (must be same as nav_up & nav_down prefix),
// and the scrolling speed (in pixels per second)
function Scroller(id,speed){
	var current_offset = 1;
	var container_height = JQ("#"+id+"-scroller").height(); // Height of the container frame
	var list_height = JQ("#"+id+"-scroller ul").height(); // Total height of the scrolling div
	var functional_height = list_height - container_height; // Height where full page will be visible
	var scroll_speed = speed; //px per second
	var total_scroll_time = (functional_height / scroll_speed) * 1000;

	// Set buttons' hrefs' to void and add onclick scrolling, iff the list is longer than the container. 
	this.init = function(){
		if ( list_height > ( container_height + 4 ) ){ // Allow for small overlap
			JQ("#"+id+"-nav_up, #"+id+"-nav_down").attr({'href':'javascript:void(0)'});
			JQ("#"+id+"-nav_up img, #"+id+"-nav_down img").show();
			JQ("#"+id+"-nav_up").mousedown( function(){
				current_offset = Math.abs(JQ("#"+id+"-scroller ul").css('top').split('px')[0]);
				var duration = ( current_offset / functional_height ) * total_scroll_time;
				JQ("#"+id+"-scroller ul").animate({ 'top': '1px' }, duration, "linear");
			});
			JQ("#"+id+"-nav_up").mouseup( function(){
				JQ("#"+id+"-scroller ul").stop();
			});
			JQ("#"+id+"-nav_up").mouseout( function(){
				JQ("#"+id+"-scroller ul").stop();
			});
			JQ("#"+id+"-nav_down").mousedown( function(){
				current_offset = Math.abs(JQ("#"+id+"-scroller ul").css('top').split('px')[0]);
				var duration = ( ( functional_height - current_offset ) / functional_height ) * total_scroll_time;
				JQ("#"+id+"-scroller ul").animate({ 'top': '-'+functional_height }, duration, "linear");
			});
			JQ("#"+id+"-nav_down").mouseup( function(){
				JQ("#"+id+"-scroller ul").stop();
			});
			JQ("#"+id+"-nav_down").mouseout( function(){
				JQ("#"+id+"-scroller ul").stop();
			});
		} else { // If the list isn't long enough, hide the up/down buttons.
			JQ("#"+id+"-nav_up img, #"+id+"-nav_down img").hide();
		}
	}
}

// --------
// WALLPAPER FUNCTIONS
// --------
function Wallpaper(){
	this.init = function(){
		JQ(".wallpaper").each( function(){
			var bg = JQ(this).css('background-image');
			var bg_on = bg.split('.jpg')[0]+'_over.jpg)';
			JQ(this).find('.wallpaper-links').hide();
			JQ(this).mouseover(function() {
				JQ(this).find('.wallpaper-links').show();
				JQ(this).css({'background-image': bg_on});
				}).mouseout(function() {
				JQ(this).find('.wallpaper-links').hide();
				JQ(this).css({'background-image': bg});
			});

		});
	}
}