/** * Custom inital load handler. Called when the carousel loads the initial * set of data items. Specified to the carousel as the configuration * parameter: loadInitHandler **/ var loadInitialItems = function(type, args) { var start = args[0]; var last = args[1]; load(this, start, last); }; /** * Custom load next handler. Called when the carousel loads the next * set of data items. Specified to the carousel as the configuration * parameter: loadNextHandler **/ var loadNextItems = function(type, args) { var start = args[0]; var last = args[1]; var alreadyCached = args[4]; if(!alreadyCached) { load(this, start, last); } }; /** * Custom load previous handler. Called when the carousel loads the previous * set of data items. Specified to the carousel as the configuration * parameter: loadPrevHandler **/ var loadPrevItems = function(type, args) { var start = args[0]; var last = args[1]; var alreadyCached = args[2]; if(!alreadyCached) { load(this, start, last); } }; var load = function(carousel, start, last) { for(var i=start;i<=last;i++) { carousel.addItem(i, fmtItem(header_img[i-1], header_h1[i-1], header_text[i-1], header_url[i-1], tab_current[i-1], teaser_border_bottom[i-1])); } }; var changePage = function(e, args) { var carousel = args[0]; var pageNum = args[1]; carousel.scrollTo(pageNum); carousel.stopAutoPlay(); }; /** * You must create the carousel after the page is loaded since it is * dependent on an HTML element (in this case 'dhtml-carousel'.) See the * HTML code below. **/ var carousel; // for ease of debugging; globals generally not a good idea var pageLoad = function() { carousel = new YAHOO.extension.Carousel("dhtml-carousel", { numVisible: 1, animationSpeed: 0, scrollInc: 1, size: 4, navMargin: 0, loadInitHandler: loadInitialItems, loadNextHandler: loadNextItems, loadPrevHandler: loadPrevItems, disableSelection: false, autoPlay: 10000, wrap:true, firstVisible: 2 } ); YAHOO.util.Event.addListener("tab1_1", "click", changePage, [carousel, 1]); YAHOO.util.Event.addListener("tab1_2", "click", changePage, [carousel, 1]); YAHOO.util.Event.addListener("tab1_3", "click", changePage, [carousel, 1]); YAHOO.util.Event.addListener("tab1_4", "click", changePage, [carousel, 1]); YAHOO.util.Event.addListener("tab2_1", "click", changePage, [carousel, 2]); YAHOO.util.Event.addListener("tab2_2", "click", changePage, [carousel, 2]); YAHOO.util.Event.addListener("tab2_3", "click", changePage, [carousel, 2]); YAHOO.util.Event.addListener("tab2_4", "click", changePage, [carousel, 2]); YAHOO.util.Event.addListener("tab3_1", "click", changePage, [carousel, 3]); YAHOO.util.Event.addListener("tab3_2", "click", changePage, [carousel, 3]); YAHOO.util.Event.addListener("tab3_3", "click", changePage, [carousel, 3]); YAHOO.util.Event.addListener("tab3_4", "click", changePage, [carousel, 3]); YAHOO.util.Event.addListener("tab4_1", "click", changePage, [carousel, 4]); YAHOO.util.Event.addListener("tab4_2", "click", changePage, [carousel, 4]); YAHOO.util.Event.addListener("tab4_3", "click", changePage, [carousel, 4]); YAHOO.util.Event.addListener("tab4_4", "click", changePage, [carousel, 4]); }; var stopAutoPlay = function(e) { carousel.stopAutoPlay(); }; /** * Illustrates start autoplay */ var startAutoPlay = function(e) { YAHOO.util.Dom.get("status").innerHTML = "Auto Play Started!"; carousel.startAutoPlay(25000); }; /** * Since carousel.addItem uses an HTML string to create the interface * for each carousel item, this method formats the HTML for an LI. **/ YAHOO.util.Event.addListener(window, 'load', pageLoad); YAHOO.util.Event.addListener("stop-button", 'click', stopAutoPlay); YAHOO.util.Event.addListener("start-button", 'click', startAutoPlay); YAHOO.util.Event.addListener("tab1_1", 'click', stopAutoPlay, [carousel, 1]); YAHOO.util.Event.addListener("tab1_2", 'click', stopAutoPlay, [carousel, 1]); YAHOO.util.Event.addListener("tab1_3", 'click', stopAutoPlay, [carousel, 1]); YAHOO.util.Event.addListener("tab1_4", 'click', stopAutoPlay, [carousel, 1]); /** * Image src URLs **/ var imageList = ["/images/B287.1__.1__.__.jpg","/images/IMG_1967.jpg","/images/kid_1.jpg","/images/frontporch_dog.jpg","/images/karen_tidwell.jpg","/images/nina_randolph.jpg","/images/angela_rogers.jpg","/images/joy_reidy.jpg","/images/jeanette_pelfrey.jpg","/images/Esther_McCall.jpg","/images/michele_dalton_photo.jpg"]; var urlList = ["http://tnhomeandfarm.com/index.php/site/photo_gallery/13th_annual_photo_contest_tennessee_landscapes_honorable_mention","http://tnhomeandfarm.com/index.php/site/photo_gallery/13th_annual_photo_contest_tennessee_history_honorable_mention","http://tnhomeandfarm.com/index.php/site/photo_gallery/13th_annual_photo_contest_just_kids_honorable_mention","http://tnhomeandfarm.com/index.php/site/photo_gallery/13th_annual_photo_contest_winners","http://tnhomeandfarm.com/index.php/site/photo_gallery/9th_annual_photo_contest","http://tnhomeandfarm.com/index.php/site/photo_gallery/10th_annual_photo_contest","http://tnhomeandfarm.com/index.php/site/photo_gallery/11th_annual_photo_contest","http://tnhomeandfarm.com/index.php/site/photo_gallery/12th_annual_photo_contest_tennessee_landscape_honorable_mention","http://tnhomeandfarm.com/index.php/site/photo_gallery/12th_annual_photo_contest_tennessee_history_honorable_mention","http://tnhomeandfarm.com/index.php/site/photo_gallery/12th_annual_photo_contest_tennessee_kids_honorable_mention","http://tnhomeandfarm.com/index.php/site/photo_gallery/12th_annual_photo_contest_winners"]; var titleList = ["13th Annual Photo Contest - Tennessee Landscapes/Honorable Mention","13th Annual Photo Contest - Tennessee History/Honorable Mention","13th Annual Photo Contest - Just Kids/Honorable Mention","13th Annual Photo Contest - Winners","9th Annual Photo Contest","10th Annual Photo Contest","11th Annual Photo Contest","12th Annual Photo Contest - Tennessee Landscape/Honorable Mention","12th Annual Photo Contest - Tennessee History/Honorable Mention","12th Annual Photo Contest - Tennessee Kids/Honorable Mention","12th Annual Photo Contest - Winners"]; /** * Since carousel.addItem uses an HTML string to create the interface * for each carousel item, this method formats the HTML for an LI. **/ var fmtItem = function(imgUrl, url, title) { var innerHTML = '' + title + '<\/a>'; return innerHTML; }; /** * Custom inital load handler. Called when the carousel loads the initial * set of data items. Specified to the carousel as the configuration * parameter: loadInitHandler **/ var loadInitialItems2 = function(type, args) { var start = args[0]; var last = args[1]; load(this, start, last); }; /** * Custom load next handler. Called when the carousel loads the next * set of data items. Specified to the carousel as the configuration * parameter: loadNextHandler **/ var loadNextItems2 = function(type, args) { var start = args[0]; var last = args[1]; var alreadyCached = args[2]; if(!alreadyCached) { load(this, start, last); } }; /** * Custom load previous handler. Called when the carousel loads the previous * set of data items. Specified to the carousel as the configuration * parameter: loadPrevHandler **/ var loadPrevItems2 = function(type, args) { var start = args[0]; var last = args[1]; var alreadyCached = args[2]; if(!alreadyCached) { load(this, start, last); } }; var load = function(carousel2, start, last) { for(var i=start; i<=last; i++) { carousel2.addItem(i, fmtItem(imageList[i-1], urlList[i-1], titleList[i-1])); } }; /** * Custom button state handler for enabling/disabling button state. * Called when the carousel has determined that the previous button * state should be changed. * Specified to the carousel as the configuration * parameter: prevButtonStateHandler **/ var handlePrevButtonState2 = function(type, args) { var enabling = args[0]; var leftImage = args[1]; if(enabling) { leftImage.src = "images/left-enabled.gif"; } else { leftImage.src = "images/left-disabled.gif"; } } /** * Custom button state handler for enabling/disabling button state. * Called when the carousel has determined that the next button * state should be changed. * Specified to the carousel as the configuration * parameter: nextButtonStateHandler **/ var handleNextButtonState2 = function(type, args) { var enabling = args[0]; var rightImage = args[1]; if(enabling) { rightImage.src = "images/right-enabled.gif"; } else { rightImage.src = "images/right-disabled.gif"; } }; /** * You must create the carousel after the page is loaded since it is * dependent on an HTML element (in this case 'dhtml-carousel'.) See the * HTML code below. **/ var carousel2; // for testing var pageLoad2 = function() { carousel2 = new YAHOO.extension.Carousel2("dhtml-carousel2", { numVisible: 3, animationSpeed: 0.5, animationMethod: YAHOO.util.Easing.easeBoth, scrollInc: 1, navMargin: 25, size: 11, revealAmount: 0, loadInitHandler: loadInitialItems2, prevElement: "prev-arrow2", nextElement: "next-arrow2", loadNextHandler: loadNextItems2, loadPrevHandler: loadPrevItems2, prevButtonStateHandler: handlePrevButtonState2, nextButtonStateHandler: handleNextButtonState2, wrap: true, firstVisible: 1 } ); }; YAHOO.util.Event.addListener(window, 'load', pageLoad2);