/* js enchanced functionality */

/* Noscipt - Quirksmode advises this usage to hide any noscript content with only
 * the smallest chance of non-dynamic content being displayed to the user
 */ 
var W3CDOM = (document.getElementsByTagName && document.createElement);


// For some reason I just prefer to run jQuery in no conflict mode
jQuery.noConflict();

 
// Set up the scroller widget
jQuery(document).ready(function() {
    HELScroller.init();
});
 
 //HEL scroller widget
 var HELScroller = {
     
     loadedImagesArray: null,
     loadedSlideImagesArray: null,
     imageLinksArray: null,
     imgArray: null,
     slideImgArray: null,
     altArray: null,
     scrollTimer: null,
	 rotationStopped: null,
     iteration: null,
     
     init: function() {
        //Show hidden items
        jQuery('#animated-content-scrolling-thumbs').prepend('<a class="scroll-prev"> </a>');
        jQuery('#animated-content-scrolling-thumbs').append('<a class="scroll-next"> </a>');
        jQuery('.items div').not('.items div div').show();
        //Set the loading image on the main image container
        jQuery('.animated-content-main-image-container').addClass('loading');
        HELScroller.extractImageInformation();
        HELScroller.preloadImages();
        iteration = 0;
		rotationStopped = false;
        HELScroller.setClickEvents();
        //HELScroller.setFadeEvents();
        HELScroller.initScroller();
		//If we're ready to go, go, else wait for the first item to load
		var waitTimer = setInterval(function () {
            if (HELScroller.checkItemIsReadyToDisplay(0)) {
	            HELScroller.startImageRotation();
      	        HELScroller.fadeInItem(0);
                clearInterval(waitTimer);  
	        }
        }, 1000);

        //Fixes safari win applying css before javascript runs thus hiding the scroller
        setTimeout("jQuery('.items div').not('.items div div').fadeIn(500);", 1000);
     },
	 
	 checkItemIsReadyToDisplay : function(i) {
	 	if (jQuery(loadedImagesArray[i]).data('loaded') == 'loaded' ) {
			return true;
		} else {
			return false;
		}
	 },
	 
	 fadeInItem : function (i) {
		//Create link, Create image, and append image to link
		var link = jQuery(document.createElement('a'))
		    .addClass('animated-content-main-image-link')
		    .attr('href', imageLinksArray[i])
		    .append(loadedImagesArray[i])
		    .append(jQuery(document.createElement('div')).append(loadedSlideImagesArray[i])); // Swapped span for div
			
		//fade out the panel, append link to panel, fade in the panel
		jQuery('.animated-content-main-image-container').add(jQuery('.animated-content-main-image-link span')).fadeOut(600, function(){
		    var panel = jQuery('.animated-content-main-image-container');
            jQuery('.animated-content-main-image-link', panel).remove();
		    jQuery(panel).append(link);
		    jQuery(panel).fadeIn(1000, function() {
                jQuery('.animated-content-main-image-link span').animate({width : "452px"}, 1000, "swing");
            });
		});


	 },
     
     extractImageInformation: function () {
        imgArray = new Array();
        slideImgArray = new Array();
        altArray = new Array();      
        imageLinksArray = new Array();
        jQuery('.items div').not('.items div div').each(function (){     
            //get image src
            imgArray.push(jQuery('.item-image:first', this).text());
            //get slide image src
            slideImgArray.push(jQuery('.item-slide-image:first', this).html());
            //get image alt
            altArray.push(jQuery('img:first', this).attr('alt'));  
            //get image link
            imageLinksArray.push(jQuery('.item-link:first', this).text()); 
        }); 
     },
     
     preloadImages: function () {
        loadedImagesArray = new Array();
        for (i = 0; i < imgArray.length; i++) {
            var image = jQuery(document.createElement('img'));
            jQuery(image).attr('alt',altArray[i]).attr('class', 'panel-image');;
            loadedImagesArray.push(image);
            jQuery(loadedImagesArray[i]).load(function () {
                jQuery(this).data('loaded','loaded');                   
            }).attr('src',imgArray[i]);
        }   
        loadedSlideImagesArray = new Array();
        for (i = 0; i < slideImgArray.length; i++) {
            //var image = jQuery(document.createElement('img'));
            //jQuery(image).attr('alt',altArray[i]).attr('class', 'sliding-image');
            //loadedSlideImagesArray.push(image);
            loadedSlideImagesArray.push(slideImgArray[i]); // added for HEL
			//jQuery(loadedSlideImagesArray[i]).load(function () {
            //    jQuery(this).data('loaded','loaded');                   
            //}).attr('src',slideImgArray[i]);
        }   
     },
     
     setClickEvents: function() {
        //Set the click event for the scrollable items
        jQuery('.items div').not('.items div div').click(function (){
            //Stop the image rotation
            //HELScroller.stopImageRotation();
            //get the array index
            //var indexOfThis = HELScroller.getIndexOfItem(jQuery('.item-image:first', this).text());
			//HELScroller.fadeInItem(indexOfThis);
			
			// Link directly to item page
			//location.href = jQuery('.item-link:first', this).text();
			
        });
        jQuery('.scroll-next').add('.scroll-prev').click(function (){      
            //Stop the image rotation
            HELScroller.stopImageRotation();   
        });
     },
     
     getIndexOfItem: function(clickedElementImage) {
        var indexOfThis;
        for(i = 0 ; i <= loadedImagesArray.length; i++) {
            if (clickedElementImage == jQuery(loadedImagesArray[i]).attr('src')) {
                indexOfThis = i;
            }   
        }
        return indexOfThis;
     },
     
     startImageRotation: function() {
         if (!rotationStopped) {          
             scrollTimer = setInterval(function () {
                //if there is not image to remove, then there has been an error, do nothing.
                if (jQuery('.animated-content-main-image-link img').length != 0) {
                    //get the array index
                    var indexOfThis = HELScroller.getIndexOfItem(jQuery('.animated-content-main-image-link img').attr('src'));
                    if (indexOfThis == (loadedImagesArray.length - 1)) { //Loop to beginning
                        indexOfThis = -1;
                        iteration++;
                    }
                    //Do nothing if next image isn't loaded
                    if (jQuery(loadedImagesArray[indexOfThis + 1]).data('loaded') == "loaded" || iteration > 0) {
						HELScroller.fadeInItem(indexOfThis + 1);                        
                    }            
                } 
         
             },10000);
			 // Change above to 6000 when Jon wants to enable scroller again.
         }
     },
     
     stopImageRotation: function() {
	 	clearInterval(scrollTimer);
		rotationStopped = true;
     },
     
     pauseImageRotation: function(timeToPauseFor) {
	 	 clearInterval(scrollTimer);
		 if (typeof timeToPauseFor == 'number' && timeToPauseFor != 0) {
		 	setTimeout(HELScroller.startImageRotation(), abs(timeToPauseFor));     
		 }
     }, 
     
	 /*
     setFadeEvents: function() {
        //Set the fade events for the scrolling items
        jQuery("div.items div").hover(
			function () {
            	HELScroller.pauseImageRotation();
            	jQuery(this).fadeTo(100, 0.33);
        	},
			function () {
				HELScroller.startImageRotation();
				jQuery(this).fadeTo(500, 1);
			}
		);
     },
	 */
     
     initScroller: function() {
        // initialize scrollable plugin
        jQuery("div.scrollable").scrollable({
            vertical:true, 
            size: 2,
            next: ".scroll-next",
            prev: ".scroll-prev",
            keyboard: true,
            easing: "swing"
        }); 
     }
     
 };