$(document).ready(function() { /******************************************** #International Shipping / Checkout Step 1 ********************************************/ $(".validate_NONUS").hide(); $.fn.countryDetect= function(){ var countrySelect = $('.country_select option:selected').val(); $(".validate_US, .validate_NONUS").hide(); if (countrySelect == '0') { } else if (countrySelect == 'US') { $(".validate_US").fadeIn(); } else { $(".validate_NONUS").fadeIn(); } } $(".country_select select:selected").countryDetect(); //Run if already selected $(".country_select select").change(function() { // Run when option changes $(this).countryDetect(); }); /********************** Tables **********************/ $("table.tabdata").filter(function(){ /* Apply THead Background*/ $("thead tr:last-child th",this).css("background","#f1f1f1 url('/images/theme/tbl_th_bg.jpg') repeat-x bottom"); /* Remove Extra Borders */ $("tbody tr:first-child td",this).css("border-top","none"); $("tbody tr td:last-child, thead tr th:last-child",this).css("border-right","none"); }); /* Apply odd Class - Only Works on Simple Tables*/ $("table.tabdata:not(.no-odd)").each(function(){ $("tbody tr:odd",this).addClass("odd"); }); /******************** Accordion ********************/ //Accordion fuction. It is being used by the drivetrain builder. $.fn.accordion_switch = function(accordiontrigger, ignore_toggle){ if($(this).next().is(':visible') && !ignore_toggle){ $(this).toggleClass('accordiontrigger_active'); $(this).next().slideToggle('normal'); } else{ if($(this).next().is(':hidden')){ $(accordiontrigger).removeClass('accordiontrigger_active'); $('.accordioncontainer').slideUp('normal'); $(this).toggleClass('accordiontrigger_active'); $(this).next().slideToggle('normal'); } } };//end function //Show First Container and Hide the Rest var carousel_exist = $(".carousel_wrap:first").length;//Checks if there is a carousel on the current page var accordiontrigger = ""; if(carousel_exist==1){ $(".component_content").each(function (){ $('.accordioncontainer:not(:first)',this).hide(); $('.accordioncontainer:first',this).show(); $('.accordiontrigger:first',this).addClass('accordiontrigger_active'); //Accordion Trigger }); $('.accordiontrigger').click(function(){ accordiontrigger = $(this).parents(".component_content").find('.accordiontrigger'); $(this).accordion_switch(accordiontrigger); return false; }); } else{ $('.accordioncontainer:not(:first)').hide(); $('.accordioncontainer:first').show(); $('.accordiontrigger:first').addClass('accordiontrigger_active'); //Accordion Trigger $('.accordiontrigger').click(function(){ accordiontrigger = $(this).parents(".maincontent").find('.accordiontrigger'); $(this).accordion_switch(accordiontrigger); return false; }); } //Hover Fade Effect $('.accordiontrigger').hover( function(){$(this).stop().fadeTo("normal", 0.80);}, function(){$(this).stop().fadeTo("normal", 1);} ); /******************** Accordion ALT********************/ //Show First Container and Hide the Rest $('.accordioncontainer-alt:not(:first)').hide(); $('.accordioncontainer-alt:first').show(); $('.accordiontrigger-alt:first').addClass('accordiontrigger-alt_active'); //Hover Fade Effect $('.accordiontrigger-alt').hover( function(){$(this).stop().fadeTo("normal", 0.80);}, function(){$(this).stop().fadeTo("normal", 1);} ); //Accordion Trigger $('.accordiontrigger-alt').click(function(){ if($(this).next().is(':visible')){ $(this).toggleClass('accordiontrigger-alt_active'); $(this).next().slideToggle('slow'); } else{ $('.accordiontrigger-alt').removeClass('accordiontrigger-alt_active'); $('.accordioncontainer-alt').slideUp('slow'); $(this).toggleClass('accordiontrigger-alt_active'); $(this).next().slideToggle('slow'); } return false; }); /********************* Toggle **********************/ //Hide (Collapse) the toggle containers on load $(".toggle_container").hide(); //Slide up and down on click $(".toggle_trigger").click(function(){ $(this).toggleClass("active"); $(this).next(".toggle_container").slideToggle("slow"); return false; }); /********************** Col1 ***********************/ $('ul.col1 li:first-child').addClass('border_none'); /*********************** PDF ***********************/ $("a[href$='.pdf']:not(:has('img'))").addClass("download"); /******************** ON SALE NOW PAGE ********************/ //Sort Promo with Cat ID /*--Special Deals Page--*/ $("#catidselector select").change(function() { $("ul.col1 li, .js_message").fadeOut('fast'); var catidVal = $(this).val(); //Get Cat ID //var catName = $("#catidselector select :selected").text(); Unused variable if ($("li").hasClass("catid_" + catidVal)) { //If selection matches cat ID $("li.catid_" + catidVal).fadeIn('fast'); } else if ( catidVal == '-1' ) { //If selection is default $("ul.col1 li").show(); } }); /******************** Carousel Functions ********************/ /////Finds the current page the Carousel is on the viewport $.fn.find_carousel_current_page = function(current_element,carousel){ var carousel_current = $(current_element).parents(".rotator").css("margin-left");//Gets how much the carousel scrolls left/right var sizeof_carousel_current = carousel_current.length;//Get the current size of the carousel var stringof_carousel_current = parseInt(carousel_current.substring(0,sizeof_carousel_current-2),10);//Remove "px" from result var page = Math.ceil((Math.sqrt(stringof_carousel_current*stringof_carousel_current)/parseInt(carousel,10)))+1; //Current result is a negative number. First is converted to positive and then added +1 so that the pages starts on 1 instead of 0. All of this finds the current page. return [page]; };//end function /////Gets all the variables for the Carousel $.fn.find_carousel_page = function(current_element){ var component_index = ($(current_element).prevAll().length)+1;//Returns the position of the current item in relation to the list. var component_index_ori = component_index; var carousel = $(current_element).parents(".carousel").width();//Gets the size of the carousel var rotatorLi = $(current_element).width(); var rotatorMaxLi = Math.floor(carousel / rotatorLi); //See how many lists can fit in the carousel viewport var rotatorSum = $(current_element).parents(".carousel").find("ul.rotator li").size(); var rotatorSlideSum = Math.ceil(rotatorSum / rotatorMaxLi); //See how many slides (sections viewable in carousel viewport) we will need var adjustLi = (carousel / rotatorMaxLi); //Perfect width that would fit in carousel viewport var adjustRotator = (adjustLi * rotatorSum); //Get width of adjusted rotator var lastSlideSum = Math.floor(adjustRotator / carousel); //Get the whole number of slides that can fit in carousel (for remainder of slides) var lastSlide = (carousel * lastSlideSum) - adjustRotator; //Get the distance of the remaining slides var lastSlide_ori = lastSlide; var page = $(this).find_carousel_current_page(current_element,carousel); var total_pages = Math.ceil(rotatorSum/rotatorMaxLi);//Total amount of pages if(component_index%rotatorMaxLi===0){component_index = component_index - 1;} var itemOnPage = parseInt((component_index/rotatorMaxLi),10)+1; //Finds the page where the current item is located if(lastSlide===0){lastSlide=carousel-(2*carousel);}//Checks if all pages have the same amount of items. lastSlide=0 means that all pages have the same amount of items and for that reason we use the value of "carousel". Result needs to be a negative number. return [itemOnPage, page, total_pages, lastSlide_ori, rotatorMaxLi, adjustLi, adjustRotator, rotatorSlideSum, lastSlide, carousel, rotatorSum, component_index,component_index_ori]; };//end function /////Carousel Function + Smart Columns $.fn.carousel = function(check_height){ var current_element = $(this).find(".rotator li"); var set_carousel = $(this).find_carousel_page(current_element); var total_pages = set_carousel[2]; var adjustLi = set_carousel[5]; var adjustRotator = set_carousel[6]; var rotatorSlideSum = set_carousel[7]; var lastSlide = set_carousel[8]; var carousel = set_carousel[9]; var carousel_current_page = $(this).find_carousel_current_page(current_element,carousel); $(this).find("ul.rotator li").css({ 'width' : adjustLi}); //Adjust width $(this).find("ul.rotator").css({ 'width' : adjustRotator}); //Adjust width //Get tallest list item in carousel (prevents truncation) var tallest = 0; $(this).find("ul.rotator li").each(function() { var rotatorLiHeight = $(this).height(); if (rotatorLiHeight > tallest) { tallest = rotatorLiHeight + 20; //20 takes in consideration of padding 10px 0; } }); if(check_height === null){//If we don't get a fixed value we assign the one we calculated. $(this).find(".carousel").css({ 'height' : tallest}); //Adjust Height of Carousel } else{ $(this).css("height",check_height); } var sum = 0; //Set Count for clicks if (carousel < adjustRotator) { //If the list is bigger than the carousel viewport $(this).find("a.right-scroll").click(function() { carousel_current_page = $(this).find_carousel_current_page(current_element,carousel);//Finds the page the viewport is in and assings the values to the variables sum = carousel_current_page[0]; rotatorSlideSum=total_pages; if(sum < (rotatorSlideSum)) { //sum is less that the whole amount of slides //sum++; $(this).parent().find("a.left-scroll").removeClass("deactive"); switch(sum){ case rotatorSlideSum: //on the last slide... $(this).addClass("deactive"); break; case rotatorSlideSum-1: //second to last slide... $(this).addClass("deactive"); if (lastSlide < -1) { $(this).parent().find("ul.rotator").animate({ marginLeft: "+=" + lastSlide }, 250); } else { $(this).parent().find("ul.rotator").animate({ marginLeft: "-=" + carousel }, 250); } break; default: //on click else $(this).parent().find("ul.rotator").animate({ marginLeft: "-=" + carousel }, 250); break; } } return false; }); $(this).find("a.left-scroll").addClass("deactive"); $(this).find("a.left-scroll").click(function() { carousel_current_page = $(this).find_carousel_current_page(current_element,carousel);//Finds the page the viewport is in and assings the values to the variables sum = carousel_current_page[0]-1; rotatorSlideSum=total_pages; if(sum > 0) { sum--; $(this).parent().find("a.right-scroll").removeClass("deactive"); switch(sum){ case 0: //if back to original slide... if (lastSlide < -1 && rotatorSlideSum == 2 ) { $(this).parent().find("ul.rotator").animate({ marginLeft: "-=" + lastSlide }, 250); } else { $(this).parent().find("ul.rotator").animate({ marginLeft: "+=" + carousel }, 250); } $(this).addClass("deactive"); break; case rotatorSlideSum-2: //1st click back from the last slide... if (lastSlide < -1) { $(this).parent().find("ul.rotator").animate({ marginLeft: "-=" + lastSlide }, 250); } else { $(this).parent().find("ul.rotator").animate({ marginLeft: "+=" + carousel }, 250); } break; default: $(this).parent().find("ul.rotator").animate({ marginLeft: "+=" + carousel }, 250); break; } } return false; }); } //end switch case else { //if there is only one slide... $(this).find("a.right-scroll, a.left-scroll").addClass("deactive"); }//end if carasouel statement };//end function $.fn.find_component_to_switch = function(current_element){ //alert(current_element); $(this).parents(".carousel").find("ul.rotator li").removeClass("active"); $(this).addClass("active"); $(this).parents(".carousel_wrap").parent().find(".component_content").hide(); $(this).parents(".carousel_wrap").parent().find(current_element).show(); $(this).animate({ opacity: '1' } , 100); $(this).siblings().not(".active").animate({ opacity: '0.7' } , 100); //If its not active, then dim it back down };//end function $.fn.FixAccordion = function(){//Reinitialize accordion $('.accordioncontainer:not(:first)', this).hide(); $('.accordioncontainer:first', this).show(); $('.accordiontrigger:first', this).addClass('accordiontrigger_active'); } /////Tabbed Function + Hover Effects for Drivetrain Component $.fn.component_switch = function(){ //On Click - Tab like feature $(this).find("ul.rotator li").click(function () { var active_show = $(this).find("a").attr("href"); //Get tab ID off of href var ahref_index = active_show.search(/#/i); if(ahref_index > 0){ active_show = active_show.slice(ahref_index);//Added for IE7 because it adds the site URL before the # } $(this).find_component_to_switch(active_show); //This was added to reload everything after a product was removed from the review parts var accordion_container_size = $(".component_content:visible").find(".accordioncontainer:visible").length; if (accordion_container_size > 1) { $(".component_content:visible").FixAccordion(); } return false; }); //Set opacity on all lists + hover effects for each $(this).find("ul.rotator li").animate({ opacity: '0.7' } , 1).hover(function() { $(this).find("img").stop().animate({ marginTop: '-10px', marginBottom: '10px' } , 100); $(this).stop().animate({ opacity: '1' } , 100); } , function() { $(this).find("img").stop().animate({ marginTop: '0' , marginBottom: '0' } , 100); $("ul.rotator li:not(.active)").stop().animate({ opacity: '0.7' } , 100); //If its not active, then dim it back down }); $(this).find(".dt_components ul.rotator li").animate({ opacity: '0.7' } , 1).hover(function() { $(this).find("img").stop().animate({ marginTop: '-4px', marginBottom: '9px' } , 100); $(this).stop().animate({ opacity: '1' } , 100); } , function() { $(this).find("img").stop().animate({ marginTop: '0' , marginBottom: '5px' } , 100); $(".dt_components ul.rotator li:not(.active)").stop().animate({ opacity: '0.7' } , 100); //If its not active, then dim it back down }); var rotator_li_active = $("ul.rotator li.active").length; //Inizializes the carousel only if no components have been previously selected. This prevents to inizialize everything when we select a product (.net issue) if(rotator_li_active == 0){ //Highlight first list item $("ul.rotator").find("li:first").animate({ opacity: '1' } , 1).addClass("active"); //Hide component tab containers on load $(".component_content").hide(); //Hide all component contents $(".tabcontent:first").show(); $("#rear_axle, #front_axle").find(".component_content:first").show(); //Show first component content } else{ $("ul.rotator li.active").stop().animate({ opacity: '1' } , 100); } };//end function ////Trigger Carousel + Component Functions //If this is the drivetrain components... if($(".carousel_wrap").is(':visible')){//Make sure the carousel is visible if ( $(".dt_components").length > 0){ $("#rear_axle").carousel(); $("#rear_axle").component_switch(); $("#front_axle").carousel(); $("#front_axle").component_switch(); } else { //Trigger function on load $("div[class^='carousel']").carousel(); } } $.fn.tab_switch = function(show_active_tab){ $(".selecttab , .tab_nav li").removeClass("selecttab"); $(this).addClass("selecttab"); $(".tabcontent").hide(); if ( $(".power_reviews").length > 0 ) { $(show_active_tab).show(); } else { $(show_active_tab).show(); } };//end function /******************************************** #Tabs ********************************************/ //If its in the all brands page, default should show all content containers if ($('#allbrands').is(':visible')) { } else { //if not only show first content container $(".tabcontent").hide(); $(".tabcontent:first").show(); } $(".tab_nav li a[href*=#]").click(function () { $(".selecttab").removeClass("selecttab"); $(this).parent().addClass("selecttab"); var active_show = $(this).parent().attr("title"); var active_show_anchor = $(this).attr("href"); if ( active_show_anchor == "#activeAll" ) { //Shows all content for all brands $(".tabcontent").show(); } else { $(".tabcontent").hide(); } if( active_show == '') { $(active_show_anchor).show(); } else { $("#"+active_show).show(); } return false; }); /******************** Drive Train Carousel Functions ********************/ $.fn.find_amount_of_tabs = function(current_element){ var tab = $(current_element).parents("#center").find(".tabcontent"); var tab_amount = $(tab).size(); var current_tab = ($(current_element).parents(".tabcontent").prevAll(".tabcontent").length)+1;//Returns current tab. Is Set to start at 1 instead of 0. return [tab_amount,current_tab]; };//end function $.fn.component_scroller = function(itemOnPage,page,total_pages,current_element,lastSlide,lastSlide_ori,carousel,left_scroller,right_scroller){ var carousel_new =""; var carousel_current_page = ""; var current_page="" var pages_from_currentelement = Math.sqrt((itemOnPage-page)*(itemOnPage-page));//This will give us the amount of pages we need to scroll (in case we have more than 2). If the result comes out as negative it means we will be scrolling left but we need a positive number anyways. So we do sqr(x^2) to make it positive. if(lastSlide_ori!==0 && page 1){//If we have more than 2 pages it needs to calculate the right amount of pages to scroll to show the element carousel_new=carousel-(2*carousel);//Turning the value of carousel into a negative number if(lastSlide_ori===0){ lastSlide=lastSlide*(pages_from_currentelement-1); } else{ lastSlide=(carousel_new*(pages_from_currentelement-1))+lastSlide; } } //alert("Page: "+page+" | Item on Page: "+itemOnPage+" | LastSlide:"+lastSlide+" | Pages from Current Element: "+pages_from_currentelement); if(itemOnPagepage){//Scroll Right $(current_element).parent().animate({ marginLeft: "+=" + lastSlide }, 250).queue(function (){ carousel_current_page = $(this).find_carousel_current_page(current_element,carousel); current_page = carousel_current_page[0]; switch(current_page){ case total_pages: $(right_scroller).addClass("deactive"); $(left_scroller).removeClass("deactive"); break; case 1: $(left_scroller).addClass("deactive"); $(right_scroller).removeClass("deactive"); break; default: $(left_scroller).removeClass("deactive"); $(right_scroller).removeClass("deactive"); break; } $(this).dequeue(); }); } };//end function $.fn.wizard_nav_carousel_page = function(current_element,itemOnPage,lastSlide,lastSlide_ori,carousel,page,total_pages,right_scroller,left_scroller,direction){ var carousel_new =""; var carousel_current_page = ""; var pages_from_currentelement = Math.sqrt((itemOnPage-page)*(itemOnPage-page));//This will give us the amount of pages we need to scroll (in case we have more than 2). If the result comes out as negative it means we will be scrolling left but we need a positive number anyways. So we do sqr(x^2) to make it positive. //alert((parseInt(page)+1)+" "+total_pages+" "+lastSlide+" "+lastSlide_ori+" "+carousel); if(direction == "scroll-left"){ if((parseInt(page)+1)= 1){//If we have more than 2 pages it needs to calculate the right amount of pages to scroll to show the element carousel_new=carousel-(2*carousel); if(lastSlide===0){ lastSlide=lastSlide*(pages_from_currentelement-1); } else{ lastSlide=(carousel_new*(pages_from_currentelement-1))+lastSlide_ori; } } $(current_element).parent().animate({ marginLeft: "+=" + lastSlide }, 250); page++; }else{ if(page != total_pages){//This makes sure we only use the lastslide value on the last page of the carousel.lastSlide=0 means that all pages have the same amount of items lastSlide=carousel-(2*carousel); } if(pages_from_currentelement >= 1){//If we have more than 2 pages it needs to calculate the right amount of pages to scroll to show the element carousel_new=carousel-(2*carousel); if(lastSlide===0){ lastSlide=lastSlide*(pages_from_currentelement-1); } else{ lastSlide=(carousel_new*(pages_from_currentelement-1))+lastSlide_ori; } } $(current_element).parent().animate({ marginLeft: "-=" + lastSlide }, 250); page--; } switch(page){ case total_pages: $(right_scroller).addClass("deactive"); $(left_scroller).removeClass("deactive"); break; case 1: $(left_scroller).addClass("deactive"); $(right_scroller).removeClass("deactive"); break; default: $(left_scroller).removeClass("deactive"); $(right_scroller).removeClass("deactive"); break; } return (page); };//end function $(".wizard_nav").click(function(){ //Tabs var wizard_accion = $(this).attr("title");//We need to know if the user selected a "next","prev", or "edit" accion if(wizard_accion==""){//if we have an image link instead of a text link. wizard_accion = $(this).parent().attr("title"); } var tab = $(this).find_amount_of_tabs(this); var tab_amount = tab[0];//Gets the total amount of tabs var current_tab = tab[1];//Gets the current active tab var next_tab_id = $(this).parents(".tabcontent").next().attr("id");//We get the ID for the next tab (ie. front axle) var prev_tab_id = $(this).parents(".tabcontent").prev().attr("id");//We get the ID for the previous tab (ie. front axle) //Carousel var accordion_exist = $(this).parents(".tabcontent").find(".accordioncontainer:first").length;//Checks if there is a carousel on the current page var carousel_exist = $(this).parents(".tabcontent").find(".carousel_wrap").length;//Checks if there is a carousel on the current page //Initializing variables var set_carousel = ""; var next_element_id = ""; var next_element = ""; var prev_element_id = ""; var prev_element = ""; var page = ""; var elements_per_page = ""; var total_pages = ""; var total_elements = ""; var component_index = ""; var lastSlide = ""; var itemOnPage = ""; var carousel = ""; var left_scroller = ""; var right_scroller = ""; var carousel_current_page = ""; var lastSlide_ori = ""; var get_current_element_id = ""; var current_element = ""; var wiz_category = ""; var wiz_subcategory = ""; var wiz_product = ""; if(carousel_exist == 1 || wizard_accion=="edit"){//We only get this values if there is a carousel on the page or if we are on the edit page. get_current_element_id = "ul.rotator li a[href='#"+$(this).parents(".component_content").attr("id")+"']"; current_element = $(this).parents(".component_content").prevAll(".carousel_wrap").find(get_current_element_id).parent("ul.rotator li"); if(wizard_accion=="edit"){//This is an edit so we switch tabs first - must be done before anything else so the carousel is visible and we don't get an error. wiz_category = $(this).parents("#shoppingcart").attr("title");//We get the category (rear or front axle) wiz_subcategory = "#"+$(this).parents(".desc").find("strong").attr("title");//The subcategory (ie. Ring & Pinion) wiz_product = $(this).parent().attr("title");//We get product (ie. G2 Axle) current_element = $(this).parents().find("div#"+wiz_category+" div.carousel_wrap ul.rotator li a[href='"+wiz_subcategory+"']").parents("ul.rotator li");//We position the carousel on the element we are looking for $(".tab_nav li[title='"+wiz_category+"']").tab_switch("#"+wiz_category);//Switch Tab } set_carousel = $(this).find_carousel_page(current_element);//Gets the carousel data next_element_id = $(current_element).next().find("a").attr("href"); next_element = $(current_element).next().find("a[href='"+next_element_id+"']").parent("ul.rotator li"); prev_element_id = $(current_element).prev().find("a").attr("href"); prev_element = $(current_element).prev().find("a[href='"+prev_element_id+"']").parent("ul.rotator li"); page = set_carousel[1];//This variable will change if "edit" is selected elements_per_page = set_carousel[4]; total_pages = set_carousel[2]; total_elements = set_carousel[10]; component_index = set_carousel[12]; lastSlide = set_carousel[8]; lastSlide_ori = set_carousel[3]; itemOnPage = set_carousel[0]; carousel = set_carousel[9]; left_scroller = $(current_element).parents(".carousel").find("a.left-scroll"); right_scroller = $(current_element).parents(".carousel").find("a.right-scroll"); //Change or edit product carousel_current_page = $(this).find_carousel_current_page(current_element,carousel); } //Other var element = ""; var element_id = ""; switch(wizard_accion){ case "next": element = next_element; element_id = next_element_id; //lastSlide=carousel;/****************************************************************************************************************************************************************/ if(page > itemOnPage){ page = $(this).wizard_nav_carousel_page(current_element,itemOnPage,lastSlide,lastSlide_ori,carousel,page,total_pages,right_scroller,left_scroller,"scroll-right"); } if(component_index%elements_per_page===0 && page != total_pages){//Switches between elements of the carousel page = $(this).wizard_nav_carousel_page(current_element,itemOnPage,lastSlide,lastSlide_ori,carousel,page,total_pages,right_scroller,left_scroller,"scroll-left"); } $(element).find_component_to_switch(element_id);//We switch to next element if(component_index==total_elements && current_tab < tab_amount){//Time to switch tab $(".tab_nav li[title='"+next_tab_id+"']").tab_switch("#"+next_tab_id);//Switch Tab - must be done before anything else so the carousel is visible and we don't get an error wiz_subcategory = $(this).parents(".tabcontent").next().find(".rotator li:first a").attr("href"); current_element = $(this).parents().find("div#"+next_tab_id+" div.carousel_wrap ul.rotator li a[href='"+wiz_subcategory+"']").parents("ul.rotator li");//We position the carousel on the element we are looking for $(current_element).find_component_to_switch(wiz_subcategory);//We switch to the first element of the carousel //Get the current page we are in and the page number the last item is (itemOnpage) set_carousel = $(this).find_carousel_page(current_element); page = set_carousel[1]; itemOnPage = set_carousel[0]; total_pages = set_carousel[2]; left_scroller = $(current_element).parents(".carousel").find("a.left-scroll"); right_scroller = $(current_element).parents(".carousel").find("a.right-scroll"); if(page != itemOnPage){//We scroll to the first page if we are not there $(this).component_scroller(itemOnPage,page,total_pages,current_element,lastSlide,lastSlide_ori,carousel,left_scroller,right_scroller); $(left_scroller).addClass("deactive"); if(total_pages>1){ $(right_scroller).removeClass("deactive"); } } } $( 'html, body' ).animate( { scrollTop: 0 }, 0 );//We send the user to the top of the page break; case "prev": element = prev_element; element_id = prev_element_id; if(page < itemOnPage){ page = $(this).wizard_nav_carousel_page(current_element,itemOnPage,lastSlide,lastSlide_ori,carousel,page,total_pages,right_scroller,left_scroller,"scroll-left"); } if((component_index-1)%elements_per_page===0 && page != 1){ page = $(this).wizard_nav_carousel_page(current_element,itemOnPage,lastSlide,lastSlide_ori,carousel,page,total_pages,right_scroller,left_scroller,"scroll-right"); } $(element).find_component_to_switch(element_id);//We switch to previous element if(component_index==1 && current_tab > 1){//Time to switch tab $(".tab_nav li[title='"+prev_tab_id+"']").tab_switch("#"+prev_tab_id);//Switch Tab - must be done before anything else so the carousel is visible and we don't get an error wiz_subcategory = $(this).parents(".tabcontent").prev().find(".rotator li:last a").attr("href"); current_element = $(this).parents().find("div#"+prev_tab_id+" div.carousel_wrap ul.rotator li a[href='"+wiz_subcategory+"']").parents("ul.rotator li");//We position the carousel on the element we are looking for $(current_element).find_component_to_switch(wiz_subcategory);//We switch to the last element of the carousel //Get the current page we are in and the page number the last item is (itemOnpage) set_carousel = $(this).find_carousel_page(current_element); page = set_carousel[1]; itemOnPage = set_carousel[0]; total_pages = set_carousel[2]; left_scroller = $(current_element).parents(".carousel").find("a.left-scroll"); right_scroller = $(current_element).parents(".carousel").find("a.right-scroll"); if(page != itemOnPage){//We scroll to the last page if we are not there $(this).component_scroller(itemOnPage,page,total_pages,current_element,lastSlide,lastSlide_ori,carousel,left_scroller,right_scroller); $(right_scroller).addClass("deactive"); if(total_pages>1){ $(left_scroller).removeClass("deactive"); } } } $( 'html, body' ).animate( { scrollTop: 0 }, 0 );//We send the user to the top of the page break; case "edit": page = carousel_current_page[0]; $(current_element).siblings().animate({ opacity: '0.7' } , 100); //Dim down all elements with the exception of the one we selected $(current_element).find_component_to_switch(wiz_subcategory);//Switches the carousel to the element we need $(current_element).animate({ opacity: '1' } , 100);//Highlight out element $( 'html, body' ).animate( { scrollTop: 0 }, 0 );//We send the user to the top of the page //We scroll to the page that has the element $(this).component_scroller(itemOnPage,page,total_pages,current_element,lastSlide,lastSlide_ori,carousel,left_scroller,right_scroller); //If there is an accordion and we got an edit. Open the right slide if(accordion_exist == 1 || wizard_accion=="edit"){ var accordiontrigger = $(current_element).parents(".tabcontent").find(wiz_subcategory).find(".accordiontrigger:contains('"+wiz_product+"')"); var accordiontrigger_parent = $(accordiontrigger).parent().find(".accordiontrigger"); $(accordiontrigger).accordion_switch(accordiontrigger_parent, 1); if(page==1){ $(left_scroller).addClass("deactive"); } if(total_pages>1){ $(right_scroller).removeClass("deactive"); } } break; case "review": next_tab_id = "review_parts"; $( 'html, body' ).animate( { scrollTop: 0 }, 0 );//We send the user to the top of the page $(".tab_nav li[title='"+next_tab_id+"']").tab_switch("#"+next_tab_id);//Switch Tab to review parts break; } return false; }); /*************** Drive Train Carousel Functions - End *****************/ /* ------------------------------------------------------------------------ Class: prettyPhoto Use: Lightbox clone for jQuery Author: Stephane Caron (http://www.no-margin-for-errors.com) Version: 2.4.3 ------------------------------------------------------------------------- */ var $pp_pic_holder; var $ppt; (function($) { $.fn.prettyPhoto = function(settings) { // global Variables var doresize = true; var percentBased = false; var imagesArray = []; var setPosition = 0; /* Position in the set */ var pp_contentHeight; var pp_contentWidth; var pp_containerHeight; var pp_containerWidth; var pp_type = 'image'; // Global elements var $caller; var $scrollPos = _getScroll(); $(window).scroll(function(){ $scrollPos = _getScroll(); _centerPicture(); }); $(window).resize(function(){ _centerPicture(); _resizeOverlay(); }); $(document).keypress(function(e){ switch(e.keyCode){ case 37: if (setPosition == 1) return; changePicture('previous'); break; case 39: if (setPosition == setCount) return; changePicture('next'); break; case 27: close(); break; }; }); settings = jQuery.extend({ animationSpeed: 'normal', /* fast/slow/normal */ padding: 40, /* padding for each side of the picture */ opacity: 0.80, /* Value between 0 and 1 */ showTitle: false, /* true/false */ allowresize: true, /* true/false */ counter_separator_label: '/', /* The separator for the gallery counter 1 "of" 2 */ theme: 'light_rounded', /* light_rounded / dark_rounded / light_square / dark_square */ callback: function(){} }, settings); // Fallback to a supported theme for IE6 if($.browser.msie && $.browser.version == 6){ settings.theme = "light_square"; } $(this).each(function(){ var hasTitle = false; var isSet = false; var setCount = 0; /* Total images in the set */ var arrayPosition = 0; /* Total position in the array */ imagesArray[imagesArray.length] = this; $(this).bind('click',function(){ open(this); return false; }); }); function open(el) { $caller = $(el); // Find out if the picture is part of a set theRel = $caller.attr('rel'); galleryRegExp = /\[(?:.*)\]/; theGallery = galleryRegExp.exec(theRel); // Calculate the number of items in the set, and the position of the clicked picture. isSet = false; setCount = 0; _getFileType(); for (i = 0; i < imagesArray.length; i++){ if($(imagesArray[i]).attr('rel').indexOf(theGallery) != -1){ setCount++; if(setCount > 1) isSet = true; if($(imagesArray[i]).attr('href') == $caller.attr('href')){ setPosition = setCount; arrayPosition = i; }; }; }; _buildOverlay(); // Display the current position $pp_pic_holder.find('p.currentTextHolder').text(setPosition + settings.counter_separator_label + setCount); // Position the picture in the center of the viewing area _centerPicture(); $('#pp_full_res').hide(); $pp_pic_holder.find('.pp_loaderIcon').show(); }; showimage = function(width,height,containerWidth,containerHeight,contentHeight,contentWidth,resized){ $('.pp_loaderIcon').hide(); if($.browser.opera) { windowHeight = window.innerHeight; windowWidth = window.innerWidth; }else{ windowHeight = $(window).height(); windowWidth = $(window).width(); }; $pp_pic_holder.find('.pp_content').animate({'height':contentHeight},settings.animationSpeed); projectedTop = $scrollPos['scrollTop'] + ((windowHeight/2) - (containerHeight/2)); if(projectedTop < 0) projectedTop = 0 + $pp_pic_holder.find('.ppt').height(); // Resize the holder $pp_pic_holder.animate({ 'top': projectedTop, 'left': ((windowWidth/2) - (containerWidth/2)), 'width': containerWidth },settings.animationSpeed,function(){ $pp_pic_holder.width(containerWidth); $pp_pic_holder.find('.pp_hoverContainer,#fullResImage').height(height).width(width); // Fade the new image $pp_pic_holder.find('#pp_full_res').fadeIn(settings.animationSpeed,function(){ $(this).find('object,embed').css('visibility','visible'); }); // Show the nav elements _showContent(); // Fade the resizing link if the image is resized if(resized) $('a.pp_expand,a.pp_contract').fadeIn(settings.animationSpeed); }); }; function _showContent(){ // Show the nav if(isSet && pp_type=="image") { $pp_pic_holder.find('.pp_hoverContainer').fadeIn(settings.animationSpeed); }else{ $pp_pic_holder.find('.pp_hoverContainer').hide(); } $pp_pic_holder.find('.pp_details').fadeIn(settings.animationSpeed); // Show the title if(settings.showTitle && hasTitle){ $ppt.css({ 'top' : $pp_pic_holder.offset().top - 22, 'left' : $pp_pic_holder.offset().left + (settings.padding/2), 'display' : 'none' }); $ppt.fadeIn(settings.animationSpeed); }; } function _hideContent(){ // Fade out the current picture $pp_pic_holder.find('.pp_hoverContainer,.pp_details').fadeOut(settings.animationSpeed); $pp_pic_holder.find('#pp_full_res object,#pp_full_res embed').css('visibility','hidden'); $pp_pic_holder.find('#pp_full_res').fadeOut(settings.animationSpeed,function(){ $('.pp_loaderIcon').show(); // Preload the image _preload(); }); // Hide the title $ppt.fadeOut(settings.animationSpeed); } function changePicture(direction){ if(direction == 'previous') { arrayPosition--; setPosition--; }else{ arrayPosition++; setPosition++; }; // Allow the resizing of the images if(!doresize) doresize = true; _hideContent(); $('a.pp_expand,a.pp_contract').fadeOut(settings.animationSpeed,function(){ $(this).removeClass('pp_contract').addClass('pp_expand'); }); }; function close(){ $pp_pic_holder.find('object,embed').css('visibility','hidden'); $('div.pp_pic_holder,div.ppt').fadeOut(settings.animationSpeed); $('div.pp_overlay').fadeOut(settings.animationSpeed, function(){ $('div.pp_overlay,div.pp_pic_holder,div.ppt').remove(); // To fix the bug with IE select boxes if($.browser.msie && $.browser.version == 6){ $('select').css('visibility','visible'); }; settings.callback(); }); doresize = true; }; function _checkPosition(){ // If at the end, hide the next link if(setPosition == setCount) { $pp_pic_holder.find('a.pp_next').css('visibility','hidden'); $pp_pic_holder.find('a.pp_arrow_next').addClass('disabled').unbind('click'); }else{ $pp_pic_holder.find('a.pp_next').css('visibility','visible'); $pp_pic_holder.find('a.pp_arrow_next.disabled').removeClass('disabled').bind('click',function(){ changePicture('next'); return false; }); }; // If at the beginning, hide the previous link if(setPosition == 1) { $pp_pic_holder.find('a.pp_previous').css('visibility','hidden'); $pp_pic_holder.find('a.pp_arrow_previous').addClass('disabled').unbind('click'); }else{ $pp_pic_holder.find('a.pp_previous').css('visibility','visible'); $pp_pic_holder.find('a.pp_arrow_previous.disabled').removeClass('disabled').bind('click',function(){ changePicture('previous'); return false; }); }; // Change the current picture text $pp_pic_holder.find('p.currentTextHolder').text(setPosition + settings.counter_separator_label + setCount); $caller = (isSet) ? $(imagesArray[arrayPosition]) : $caller; _getFileType(); if($caller.attr('title')){ $pp_pic_holder.find('.pp_description').show().html(unescape($caller.attr('title'))); }else{ $pp_pic_holder.find('.pp_description').hide().text(''); }; if($caller.find('img').attr('alt') && settings.showTitle){ hasTitle = true; $ppt.html(unescape($caller.find('img').attr('alt'))); }else{ hasTitle = false; }; }; function _fitToViewport(width,height){ hasBeenResized = false; _getDimensions(width,height); // Define them in case there's no resize needed imageWidth = width; imageHeight = height; windowHeight = $(window).height(); windowWidth = $(window).width(); if( ((pp_containerWidth > windowWidth) || (pp_containerHeight > windowHeight)) && doresize && settings.allowresize && !percentBased) { hasBeenResized = true; notFitting = true; while (notFitting){ if((pp_containerWidth > windowWidth)){ imageWidth = (windowWidth - 200); imageHeight = (height/width) * imageWidth; }else if((pp_containerHeight > windowHeight)){ imageHeight = (windowHeight - 200); imageWidth = (width/height) * imageHeight; }else{ notFitting = false; }; pp_containerHeight = imageHeight; pp_containerWidth = imageWidth; }; _getDimensions(imageWidth,imageHeight); }; return { width:imageWidth, height:imageHeight, containerHeight:pp_containerHeight, containerWidth:pp_containerWidth, contentHeight:pp_contentHeight, contentWidth:pp_contentWidth, resized:hasBeenResized }; }; function _getDimensions(width,height){ $pp_pic_holder.find('.pp_details').width(width).find('.pp_description').width(width - parseFloat($pp_pic_holder.find('a.pp_close').css('width'))-5); /* To have the correct height */ // Get the container size, to resize the holder to the right dimensions pp_contentHeight = height + $pp_pic_holder.find('.pp_details').height() + parseFloat($pp_pic_holder.find('.pp_details').css('marginTop')) + parseFloat($pp_pic_holder.find('.pp_details').css('marginBottom')); pp_contentWidth = width; pp_containerHeight = pp_contentHeight + $pp_pic_holder.find('.ppt').height() + $pp_pic_holder.find('.pp_top').height() + $pp_pic_holder.find('.pp_bottom').height(); pp_containerWidth = width + settings.padding; } function _getFileType(){ if ($caller.attr('href').match(/youtube\.com\/watch/i)) { pp_type = 'youtube'; }else if($caller.attr('href').indexOf('.mov') != -1){ pp_type = 'quicktime'; }else if($caller.attr('href').indexOf('.swf') != -1){ pp_type = 'flash'; }else if($caller.attr('href').indexOf('iframe') != -1){ pp_type = 'iframe' }else{ pp_type = 'image'; } } function _centerPicture(){ if ($pp_pic_holder){ if($pp_pic_holder.size() == 0){ return; }}else{ return; }; //Make sure the gallery is open if($.browser.opera) { windowHeight = window.innerHeight; windowWidth = window.innerWidth; }else{ windowHeight = $(window).height(); windowWidth = $(window).width(); }; if(doresize) { $pHeight = $pp_pic_holder.height(); $pWidth = $pp_pic_holder.width(); $tHeight = $ppt.height(); projectedTop = (windowHeight/2) + $scrollPos['scrollTop'] - ($pHeight/2); if(projectedTop < 0) projectedTop = 0 + $tHeight; $pp_pic_holder.css({ 'top': projectedTop, 'left': (windowWidth/2) + $scrollPos['scrollLeft'] - ($pWidth/2) }); $ppt.css({ 'top' : projectedTop - $tHeight, 'left' : (windowWidth/2) + $scrollPos['scrollLeft'] - ($pWidth/2) + (settings.padding/2) }); }; }; function _preload(){ // Hide the next/previous links if on first or last images. _checkPosition(); if(pp_type == 'image'){ // Set the new image imgPreloader = new Image(); // Preload the neighbour images nextImage = new Image(); if(isSet && setPosition > setCount) nextImage.src = $(imagesArray[arrayPosition + 1]).attr('href'); prevImage = new Image(); if(isSet && imagesArray[arrayPosition - 1]) prevImage.src = $(imagesArray[arrayPosition - 1]).attr('href'); pp_typeMarkup = ''; $pp_pic_holder.find('#pp_full_res')[0].innerHTML = pp_typeMarkup; $pp_pic_holder.find('.pp_content').css('overflow','hidden'); $pp_pic_holder.find('#fullResImage').attr('src',$caller.attr('href')); imgPreloader.onload = function(){ var correctSizes = _fitToViewport(imgPreloader.width,imgPreloader.height); imgPreloader.width = correctSizes['width']; imgPreloader.height = correctSizes['height']; showimage(imgPreloader.width,imgPreloader.height,correctSizes["containerWidth"],correctSizes["containerHeight"],correctSizes["contentHeight"],correctSizes["contentWidth"],correctSizes["resized"]); }; imgPreloader.src = $caller.attr('href'); }else{ // Get the dimensions movie_width = ( parseFloat(grab_param('width',$caller.attr('href'))) ) ? grab_param('width',$caller.attr('href')) : "425"; movie_height = ( parseFloat(grab_param('height',$caller.attr('href'))) ) ? grab_param('height',$caller.attr('href')) : "344"; // If the size is % based if(movie_width.indexOf('%') != -1 || movie_height.indexOf('%') != -1){ movie_height = ($(window).height() * parseFloat(movie_height) / 100) - 100; movie_width = ($(window).width() * parseFloat(movie_width) / 100) - 100; parsentBased = true; }else{ movie_height = parseFloat(movie_height); movie_width = parseFloat(movie_width); } if(pp_type == 'quicktime'){ movie_height+=13; } // Fit them to viewport correctSizes = _fitToViewport(movie_width,movie_height); if(pp_type == 'youtube'){ pp_typeMarkup = ''; }else if(pp_type == 'quicktime'){ pp_typeMarkup = ''; }else if(pp_type == 'flash'){ flash_vars = $caller.attr('href'); flash_vars = flash_vars.substring($caller.attr('href').indexOf('flashvars') + 10,$caller.attr('href').length); filename = $caller.attr('href'); filename = filename.substring(0,filename.indexOf('?')); pp_typeMarkup = ''; }else if(pp_type == 'iframe'){ movie_url = $caller.attr('href'); movie_url = movie_url.substr(0,movie_url.indexOf('iframe')-1); pp_typeMarkup = ''; } // Append HTML $pp_pic_holder.find('#pp_full_res')[0].innerHTML = pp_typeMarkup; // Show content showimage(correctSizes['width'],correctSizes['height'],correctSizes["containerWidth"],correctSizes["containerHeight"],correctSizes["contentHeight"],correctSizes["contentWidth"],correctSizes["resized"]); } }; function _getScroll(){ if (self.pageYOffset) { scrollTop = self.pageYOffset; scrollLeft = self.pageXOffset; } else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict scrollTop = document.documentElement.scrollTop; scrollLeft = document.documentElement.scrollLeft; } else if (document.body) {// all other Explorers scrollTop = document.body.scrollTop; scrollLeft = document.body.scrollLeft; } return {scrollTop:scrollTop,scrollLeft:scrollLeft}; }; function _resizeOverlay() { $('div.pp_overlay').css({ 'height':$(document).height(), 'width':$(window).width() }); }; function _buildOverlay(){ toInject = ""; // Build the background overlay div toInject += "
"; // Define the markup to append, depending on the content type. if(pp_type == 'image'){ pp_typeMarkup = ''; }else{ pp_typeMarkup = ''; } // Basic HTML for the picture holder toInject += '
Expand
nextprevious
'+ pp_typeMarkup +'

Previous

0'+settings.counter_separator_label+'0

Next
Close
'; // Basic html for the title holder toInject += '
'; $('body').append(toInject); // Set my global selectors $pp_pic_holder = $('.pp_pic_holder'); $ppt = $('.ppt'); $('div.pp_overlay').css('height',$(document).height()).bind('click',function(){ close(); }); $pp_pic_holder.css({'opacity': 0}).addClass(settings.theme); $('a.pp_close').bind('click',function(){ close(); return false; }); $('a.pp_expand').bind('click',function(){ $this = $(this); // Expand the image if($this.hasClass('pp_expand')){ $this.removeClass('pp_expand').addClass('pp_contract'); doresize = false; }else{ $this.removeClass('pp_contract').addClass('pp_expand'); doresize = true; }; _hideContent(); $pp_pic_holder.find('.pp_hoverContainer, #pp_full_res, .pp_details').fadeOut(settings.animationSpeed,function(){ _preload(); }); return false; }); $pp_pic_holder.find('.pp_previous, .pp_arrow_previous').bind('click',function(){ changePicture('previous'); return false; }); $pp_pic_holder.find('.pp_next, .pp_arrow_next').bind('click',function(){ changePicture('next'); return false; }); $pp_pic_holder.find('.pp_hoverContainer').css({ 'margin-left': settings.padding/2 }); // If it's not a set, hide the links if(!isSet) { $pp_pic_holder.find('.pp_hoverContainer,.pp_nav').hide(); }; // To fix the bug with IE select boxes if($.browser.msie && $.browser.version == 6){ $('body').addClass('ie6'); $('select').css('visibility','hidden'); }; // Then fade it in $('div.pp_overlay').css('opacity',0).fadeTo(settings.animationSpeed,settings.opacity, function(){ $pp_pic_holder.css('opacity',0).fadeIn(settings.animationSpeed,function(){ $pp_pic_holder.attr('style','left:'+$pp_pic_holder.css('left')+';top:'+$pp_pic_holder.css('top')+';'); _preload(); }); }); }; }; function grab_param(name,url){ name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]"); var regexS = "[\\?&]"+name+"=([^&#]*)"; var regex = new RegExp( regexS ); var results = regex.exec( url ); if( results == null ) return ""; else return results[1]; } })(jQuery); $("a[rel^='prettyPhoto']").prettyPhoto(); });