$(document).ready(function() {
      // put all your jQuery goodness in here.
          
      $('#logoRotatorMain').cycle({
        slideExpr: '.logoRotatorMainImage',
        fx:      'fade',
        pause:   0,
        speed:    500,
        timeout:  2000,
        before: onBefore,
        after:   onAfter,
        pager:  '#logoRotatorCarouselUl',
        //pagerEvent: 'mouseover' ,
        //pauseOnPagerHover: true ,
        // callback fn that creates a thumbnail to use as pager anchor
          pagerAnchorBuilder: function(idx, slide) {
            return '<li><img src="' + jQuery(slide).children("img").eq(0).attr("src") + '" width="130" title="'+ jQuery(slide).children("img").eq(0).attr("title") +'"/></li>';
        }
      });
      
        function onBefore() {
            var imgDescHeight = $(".logoRotatorMainImage").find('.logoRotatorBlock').height();  //Calculate height of block  
          $(".logoRotatorMainImage .logoRotatorBlock").animate({ opacity: 0, marginBottom: -250 }, 500 , function() {});
                }

        function onAfter() {
            //var imgDescHeight = $(".main_image").find('.block').height();  //Calculate height of block  
          $(".logoRotatorMainImage .logoRotatorBlock").animate({ opacity: .8, marginBottom: 0 }, 500 , function() {});

          }
        
        
        
  //news rotator jquery
  
  $(".logoRotatorMainImage .logoRotatorDescription").show(); //Show Banner
  $(".logoRotatorMainImage .logoRotatorBlock").animate({ opacity: 0.85 }, 1 ); //Set Opacity
  
  // carousel code
  
   //options( 1 - ON , 0 - OFF)  
         var auto_slide = 1;  
         var hover_pause = 1;  
         var key_slide = 1;  
   
         //speed of auto slide(  
         var auto_slide_seconds = 2000;  
         /* IMPORTANT: i know the variable is called ...seconds but it's
         in milliseconds ( multiplied with 1000) '*/  
   
         /*move the last list item before the first item. The purpose of this is
         if the user clicks to slide left he will be able to see the last item.*/  
         $('#logoRotatorCarouselUl li:first').before($('#logoRotatorCarouselUl li:last'));   
   
         //check if auto sliding is enabled  
         if(auto_slide == 1){  
             /*set the interval (loop) to call function slide with option 'right'
             and set the interval time to the variable we declared previously */  
             var timer = setInterval('slide("right")', auto_slide_seconds);   
   
             /*and change the value of our hidden field that hold info about
             the interval, setting it to the number of milliseconds we declared previously*/  
             $('#logoRotatorHiddenAutoSlideSeconds').val(auto_slide_seconds);  
         }  
   
         //check if hover pause is enabled  
         if(hover_pause == 1){  
             //when hovered over the list  
             $('#logoRotatorCarouselUl').hover(function(){  
                 //stop the interval  
         $('#logoRotatorMain').cycle('pause');
                 clearInterval(timer)  
             },function(){  
                 //and when mouseout start it again  
                 timer = setInterval('slide("right")', auto_slide_seconds);
         $('#logoRotatorMain').cycle('resume');
             });  
   
         }  
   
         //check if key sliding is enabled  
         if(key_slide == 1){  
   
             //binding keypress function  
             $(document).bind('keypress', function(e) {  
                 //keyCode for left arrow is 37 and for right it's 39 '  
                 if(e.keyCode==37){  
                         //initialize the slide to left function  
                         slide('left');  
                 }else if(e.keyCode==39){  
                         //initialize the slide to right function  
                         slide('right');  
                 }  
             });  
   
         }  
  
  $("#logoRotatorCarouselUl li img[title]").tooltip('#logoRotatorDemoTip');

        
      });
      
//slide function  
 function slide(where){  
   
             //get the item width  
             var item_width = $('#logoRotatorCarouselUl li').outerWidth() + 10;  
   
             /* using a if statement and the where variable check
             we will check where the user wants to slide (left or right)*/  
             if(where == 'left'){  
                 //...calculating the new left indent of the unordered list (ul) for left sliding  
                 var left_indent = parseInt($('#logoRotatorCarouselUl').css('left')) + item_width;  
             }else{  
                 //...calculating the new left indent of the unordered list (ul) for right sliding  
                 var left_indent = parseInt($('#logoRotatorCarouselUl').css('left')) - item_width;  
   
             }  
   
             //make the sliding effect using jQuery's animate function... '  
             $('#logoRotatorCarouselUl:not(:animated)').animate({'left' : left_indent},500,function(){      
   
                 /* when the animation finishes use the if statement again, and make an ilussion
                 of infinity by changing place of last or first item*/  
                 if(where == 'left'){  
                     //...and if it slided to left we put the last item before the first item  
                     $('#logoRotatorCarouselUl li:first').before($('#logoRotatorCarouselUl li:last'));  
                 }else{  
                     //...and if it slided to right we put the first item after the last item  
                     $('#logoRotatorCarouselUl li:last').after($('#logoRotatorCarouselUl li:first'));  
                 }  
   
                 //...and then just get back the default left indent  
                 $('#logoRotatorCarouselUl').css({'left' : '-140px'});  
             });  
}