//Check what browser is being used.
var browser = navigator.appName;
var articleID = '';

// Set variables for Vimeo
var vimeoAlbum = 'album/253409';
var videoCallback = 'latestVideo';
var videosUrl = 'http://www.vimeo.com/api/v2/' + vimeoAlbum + '/videos.json';
var videoID = '';
var videoThumbnail = '';
var moogaloop = false;

//no conflict jquery 
jQuery.noConflict();

jQuery(document).ready(function(){  
	
	//Set the initial heights for content windows and positions of containers
	var divContainerHeight = jQuery("#page-wrap").height();
	var divContainerWidth = jQuery("#page-wrap").width();
	
	divContainerHeight = divContainerHeight - 165 - 528 - 95;
	divContainerWidth = divContainerWidth - 350;
	var divContentPadding = Math.round(divContainerHeight / 2);
	
	//Set Padding Height
	if (divContentPadding > 15) {
		jQuery("#rtr_content").css("margin-top", divContentPadding);
		jQuery("#rtr_content_nobkgnd").css("margin-top", divContentPadding);
	} else {
		jQuery("#rtr_content").css("margin-top", 15);
		jQuery("#rtr_content_nobkgnd").css("margin-top", 15);
	}
	
	//Set Padding Width
	if (divContainerWidth > 1110) {
		jQuery("#content_left").css("width", divContainerWidth);
	} else {
		jQuery("#content_left").css("width", 1110);
	}
	
	//If the User resizes the window, adjust the #container height
	jQuery(window).bind("resize", resizeWindow);
	function resizeWindow( e ) {
		totalPageHeight = jQuery("#page-wrap").height();
		if (totalPageHeight > 705) {
			divContainerHeight = jQuery("#page-wrap").height();
		} else {
			divContainerHeight = 705;
		}
		divContainerWidth = jQuery("#page-wrap").width();
		divContainerHeight = divContainerHeight - 165 - 528 - 95;
		divContainerWidth = divContainerWidth - 350;
		var divContentPadding = Math.round(divContainerHeight / 2);
		if (divContentPadding > 15) {
			jQuery("#rtr_content").css("margin-top", divContentPadding);
			jQuery("#rtr_content_nobkgnd").css("margin-top", divContentPadding);
		} else {
			jQuery("#rtr_content").css("margin-top", 15);
			jQuery("#rtr_content_nobkgnd").css("margin-top", 15);
		}
		
		if (divContainerWidth > 1110) {
			jQuery("#content_left").css("width", divContainerWidth);
		} else {
			jQuery("#content_left").css("width", 1110);
		}
	} 
	
	/**
	 * Blend Rollover Images
	 */
	//If not IE, use JQuery Blend
	if(browser != 'Microsoft Internet Explorer') {
		jQuery(".specs-marker a").blend({speed:1000, active:true, pulse:true});
	}
	
	/**
	 * Specs Page: Color Options
	 */
	jQuery(".color_thumb").click(function() {
		imgID = jQuery(this).attr('href').match(/#([a-z]+)/)[1];
		jQuery('#posterwall_wrapper').empty();
		jQuery('#posterwall_wrapper').prepend('<img id="posterwall" src="images/specs/rtr_' + imgID + '.jpg" alt="" />');
		jQuery('#posterwall_wrapper').prepend('<img id="posterwall_raster" src="images/backgrounds/bkgnd_fade.png" alt="" />');
		jQuery('#posterwall').posterwall({vertical_center:1, ratio:[1152,800], min_size:[1152, 800]});
		jQuery('#posterwall_raster').posterwall({vertical_center:1, ratio:[1152,800], min_size:[1152,800]});
	});
	
	//Initialize the Background Video
	jQuery.getScript(videosUrl);
	
	/**
	 * 360 Rotator on Tour Page
	 */
	jQuery(".blk_360").click(function() {	
	    jQuery("#content_360").load("360-blk.html");
	});
	jQuery(".blue_360").click(function() {	
		jQuery("#content_360").load("360-blue.html");
	});
	jQuery(".grabber_360").click(function() {	
		jQuery("#content_360").load("360-grabber.html");
	});
	jQuery(".grey_360").click(function() {	
		jQuery("#content_360").load("360-grey.html");
	});
	jQuery(".red_360").click(function() {	
		jQuery("#content_360").load("360-red.html");
	});
	jQuery(".silver_360").click(function() {	
		jQuery("#content_360").load("360-silver.html");
	});
	jQuery(".white_360").click(function() {	
		jQuery("#content_360").load("360-white.html");
	});
	
	/**
	 * Image gallery on RTR-X and RTR-C pages
	 */
	jQuery(".rtrc_thumb").click(function() {
		imgID = jQuery(this).attr('href').match(/#([0-9]+)/)[1];
		jQuery('#large_img').empty();
		jQuery('#large_img').prepend('<img src="images/limited/rtrc/rtrc_' + imgID + '.jpg" width="433" height="270" alt="" border="0" />');
	});
	jQuery(".rtrc_thumb_last").click(function() {
		imgID = jQuery(this).attr('href').match(/#([0-9]+)/)[1];
		jQuery('#large_img').empty();
		jQuery('#large_img').prepend('<img src="images/limited/rtrc/rtrc_' + imgID + '.jpg" width="433" height="270" alt="" border="0" />');
	});
	jQuery(".rtrx_thumb").click(function() {
		imgID = jQuery(this).attr('href').match(/#([0-9]+)/)[1];
		jQuery('#large_img').empty();
		jQuery('#large_img').prepend('<img src="images/limited/rtrx/rtrx_' + imgID + '.jpg" width="433" height="270" alt="" border="0" />');
	});
	jQuery(".rtrx_thumb_last").click(function() {
		imgID = jQuery(this).attr('href').match(/#([0-9]+)/)[1];
		jQuery('#large_img').empty();
		jQuery('#large_img').prepend('<img src="images/limited/rtrx/rtrx_' + imgID + '.jpg" width="433" height="270" alt="" border="0" />');
	});
	
	/**
	 * Tabs on Limited Edition RTR-X and RTR-C pages
	 */
	jQuery("ul.tabs").tabs("div.tabs_box > div");
	
	/**
	 * Tooltips for KK Sites
	 */
	 
	//Set the positions of the tooltips
	var divPageHeight = jQuery("#page-wrap").height();
	var divPageWidth = jQuery("#page-wrap").width();

	//Specs Interior Marker for Mats
	var int_mat_marker_left = (divPageWidth * 704) / 1152;
	var int_mat_marker_top = (divPageHeight * 460) / 800;
	jQuery("#interior_mats_marker").css("left", int_mat_marker_left);
	jQuery("#interior_mats_marker").css("top", int_mat_marker_top);
	
	var int_guages_marker_left = (divPageWidth * 211) / 1152;
	var int_guages_marker_top = (divPageHeight * 398) / 800;
	jQuery("#interior_guages_marker").css("left", int_guages_marker_left);
	jQuery("#interior_guages_marker").css("top", int_guages_marker_top);
	
	var int_shift_knob_left = (divPageWidth * 640) / 1152;
	var int_shift_knob_top = (divPageHeight * 467) / 800;
	jQuery("#interior_shift_knob_marker").css("left", int_shift_knob_left);
	jQuery("#interior_shift_knob_marker").css("top", int_shift_knob_top);
	
	var wheels_marker_left = (divPageWidth * 650) / 1152;
	var wheels_marker_top = (divPageHeight * 600) / 800;
	jQuery("#front_wheels_marker").css("left", wheels_marker_left);
	jQuery("#front_wheels_marker").css("top", wheels_marker_top);
	
	var stripe_marker_left = (divPageWidth * 250) / 1152;
	var stripe_marker_top = (divPageHeight * 370) / 800;
	jQuery("#front_stripe_marker").css("left", stripe_marker_left);
	jQuery("#front_stripe_marker").css("top", stripe_marker_top);
	
	var body_marker_left = (divPageWidth * 300) / 1152;
	var body_marker_top = (divPageHeight * 700) / 800;
	jQuery("#front_body_marker").css("left", body_marker_left);
	jQuery("#front_body_marker").css("top", body_marker_top);
	
	var rear_spoiler_left = (divPageWidth * 300) / 1152;
	var rear_spoiler_top = (divPageHeight * 225) / 800;
	jQuery("#rear_spoiler_marker").css("left", rear_spoiler_left);
	jQuery("#rear_spoiler_marker").css("top", rear_spoiler_top);
	
	var rear_diffuser_left = (divPageWidth * 440) / 1152;
	var rear_diffuser_top = (divPageHeight * 535) / 800;
	jQuery("#rear_diffuser_marker").css("left", rear_diffuser_left);
	jQuery("#rear_diffuser_marker").css("top", rear_diffuser_top);
	
	var side_wheels_left = (divPageWidth * 670) / 1152;
	var side_wheels_top = (divPageHeight * 684) / 800;
	jQuery("#side_wheels_marker").css("left", side_wheels_left);
	jQuery("#side_wheels_marker").css("top", side_wheels_top);
	
	var side_stripe_left = (divPageWidth * 717) / 1152;
	var side_stripe_top = (divPageHeight * 400) / 800;
	jQuery("#side_stripe_marker").css("left", side_stripe_left);
	jQuery("#side_stripe_marker").css("top", side_stripe_top);
	
	var side_body_left = (divPageWidth * 286) / 1152;
	var side_body_top = (divPageHeight * 575) / 800;
	jQuery("#side_body_marker").css("left", side_body_left);
	jQuery("#side_body_marker").css("top", side_body_top);
	
	//If the window is resized, adjust the position of the markers
	jQuery(window).bind("resize", resizeWindow);
	function resizeWindow( e ) {
		
		divPageHeight = jQuery("#page-wrap").height();
		divPageWidth = jQuery("#page-wrap").width();

		//Specs Interior Marker for Mats
		int_mat_marker_left = (divPageWidth * 704) / 1152;
		int_mat_marker_top = (divPageHeight * 460) / 800;
		jQuery("#interior_mats_marker").css("left", int_mat_marker_left);
		jQuery("#interior_mats_marker").css("top", int_mat_marker_top);
		
		int_guages_marker_left = (divPageWidth * 211) / 1152;
		int_guages_marker_top = (divPageHeight * 398) / 800;
		jQuery("#interior_guages_marker").css("left", int_guages_marker_left);
		jQuery("#interior_guages_marker").css("top", int_guages_marker_top);
		
		int_shift_knob_left = (divPageWidth * 640) / 1152;
		int_shift_knob_top = (divPageHeight * 467) / 800;
		jQuery("#interior_shift_knob_marker").css("left", int_shift_knob_left);
		jQuery("#interior_shift_knob_marker").css("top", int_shift_knob_top);
		
		wheels_marker_left = (divPageWidth * 650) / 1152;
		wheels_marker_top = (divPageHeight * 600) / 800;
		jQuery("#front_wheels_marker").css("left", wheels_marker_left);
		jQuery("#front_wheels_marker").css("top", wheels_marker_top);
		
		stripe_marker_left = (divPageWidth * 250) / 1152;
		stripe_marker_top = (divPageHeight * 370) / 800;
		jQuery("#front_stripe_marker").css("left", stripe_marker_left);
		jQuery("#front_stripe_marker").css("top", stripe_marker_top);
		
		body_marker_left = (divPageWidth * 300) / 1152;
		body_marker_top = (divPageHeight * 700) / 800;
		jQuery("#front_body_marker").css("left", body_marker_left);
		jQuery("#front_body_marker").css("top", body_marker_top);
		
		rear_spoiler_left = (divPageWidth * 300) / 1152;
		rear_spoiler_top = (divPageHeight * 225) / 800;
		jQuery("#rear_spoiler_marker").css("left", rear_spoiler_left);
		jQuery("#rear_spoiler_marker").css("top", rear_spoiler_top);
		
		rear_diffuser_left = (divPageWidth * 440) / 1152;
		rear_diffuser_top = (divPageHeight * 535) / 800;
		jQuery("#rear_diffuser_marker").css("left", rear_diffuser_left);
		jQuery("#rear_diffuser_marker").css("top", rear_diffuser_top);
		
		side_wheels_left = (divPageWidth * 670) / 1152;
		side_wheels_top = (divPageHeight * 684) / 800;
		jQuery("#side_wheels_marker").css("left", side_wheels_left);
		jQuery("#side_wheels_marker").css("top", side_wheels_top);
		
		side_stripe_left = (divPageWidth * 717) / 1152;
		side_stripe_top = (divPageHeight * 400) / 800;
		jQuery("#side_stripe_marker").css("left", side_stripe_left);
		jQuery("#side_stripe_marker").css("top", side_stripe_top);
		
		side_body_left = (divPageWidth * 286) / 1152;
		side_body_top = (divPageHeight * 575) / 800;
		jQuery("#side_body_marker").css("left", side_body_left);
		jQuery("#side_body_marker").css("top", side_body_top);
		
	}
	
	
	//Setup the tooltips when marker is hovered over
	jQuery("#interior_mats_marker").tooltip({
		tip: '#interior_mats_tip',
		effect: "fade",
		offset: [-17, 54]
	});
	
	jQuery("#interior_guages_marker").tooltip({
		tip: '#interior_guages_tip',
		effect: "fade",
		offset: [119, 90]
	});
	
	jQuery("#interior_shift_knob_marker").tooltip({
		tip: '#interior_shift_knob_tip',
		effect: "fade",
		offset: [119, -30]
	});
	
	jQuery("#front_wheels_marker").tooltip({
		tip: '#front_wheels_tip',
		effect: "fade",
		offset: [117, 92]
	});
	
	jQuery("#front_stripe_marker").tooltip({
		tip: '#front_stripe_tip',
		effect: "fade",
		offset: [-5, 55]
	});
	
	jQuery("#front_body_marker").tooltip({
		tip: '#front_body_tip',
		effect: "fade",
		offset: [-65, -128]
	});
	
	jQuery("#rear_spoiler_marker").tooltip({
		tip: '#rear_spoiler_tip',
		effect: "fade",
		offset: [118, -20]
	});
	
	jQuery("#rear_diffuser_marker").tooltip({
		tip: '#rear_diffuser_tip',
		effect: "fade",
		offset: [-68, 88]
	});
	
	jQuery("#side_stripe_marker").tooltip({
		tip: '#side_stripe_tip',
		effect: "fade",
		offset: [0, 50]
	});
	
	jQuery("#side_body_marker").tooltip({
		tip: '#side_body_tip',
		effect: "fade",
		offset: [-67, -127]
	});
	
	jQuery("#side_wheels_marker").tooltip({
		tip: '#side_wheels_tip',
		effect: "fade",
		offset: [68, 88]
	});
	
			
});

/**
* Home Page Video Player Embed Code
* Embeds latest video from Vimeo
* Background image fade out, then video appears
*/
function latestVideo(videos) {
	videoID = videos[0].id;
	showVideo(videoID);
}

//Show the Video Controls
function show_controls() {
	Swiff.remote(moogaloop, 'api_addEventListener', 'onFinish', 'video_on_stop');	
	
}

function video_on_play() {
	Swiff.remote(moogaloop, 'api_play');
	if(browser != 'Microsoft Internet Explorer') {
		jQuery("#posterwall").fadeTo(2500, 0);
		jQuery("#header").fadeTo(2500, 0);
		jQuery("#rtr_menu").fadeTo(2500, 0);
	} else {
		jQuery("#posterwall").fadeTo(2500, 0);
		jQuery("#header").fadeTo(2500, 0);
		jQuery("#rtr_menu").fadeTo(2500, 0);
	}
}

function video_on_pause() {
	Swiff.remote(moogaloop, 'api_pause');
	if(browser != 'Microsoft Internet Explorer') {
		jQuery("#header").fadeTo(2500, 100);
		jQuery("#rtr_menu").fadeTo(2500, 100);
	} else {
		jQuery("#header").fadeTo(2500, 100);
		jQuery("#rtr_menu").fadeTo(2500, 100);
	}
}
function video_on_mute() {
	Swiff.remote(moogaloop, 'api_setVolume', 0);
}
function video_on_sound() {
	Swiff.remote(moogaloop, 'api_setVolume', 100);
}
function video_on_stop() {
	Swiff.remote(moogaloop, 'api_pause');
	Swiff.remote(moogaloop, 'api_seekTo', 0);
	if(browser != 'Microsoft Internet Explorer') {
		jQuery("#posterwall").fadeTo(2500, 100);
		jQuery("#header").fadeTo(2500, 100);
		jQuery("#rtr_menu").fadeTo(2500, 100);
	} else {
		jQuery("#posterwall").fadeTo(2500, 100);
		jQuery("#header").fadeTo(2500, 100);
		jQuery("#rtr_menu").fadeTo(2500, 100);
	}
	
}

function embedVideo(video_id) {
	var swf_id = 'video';
	moogaloop = new Swiff('http://vimeo.com/moogaloop.swf', {
		id: swf_id,
		container: 'video',	
		width: 1280,
		height: 720,
		vars: {
			clip_id: video_id,
			show_portrait: 0,
			show_byline: 0,
			show_title: 0,
			autoplay: 1,
			js_api: 1, // required in order to use the Javascript API
			js_onLoad: 'show_controls', // moogaloop will call this JS function when it's done loading (optional)
			js_swf_id: 'video' // this will be passed into all event methods so you can keep track of multiple moogaloops (optional)
		},
		params: {
			allowscriptaccess: 'always',
			allowfullscreen: 'true',
			wmode: 'transparent'
		}
	}).toElement();
	
}

function showVideo(video_id) {

	jQuery("#posterwall").fadeTo(2500, 0, embedVideo(video_id));
	jQuery("#header").fadeTo(2500, 0);
	jQuery("#rtr_menu").fadeTo(2500, 0);
		
}
