var startScroll = true;

$(function() {

   var $scrollers = $('.scrollingHotSpotLeft, .scrollingHotSpotRight');
   var $div = $("div#makeMeScrollable");


   $div.smoothDivScroll({
      autoScroll: "onstart",
      autoScrollDirection: "backandforth",
      autoScrollStep: 1,
      autoScrollInterval: 15,
      //startAtElementId: "startAtMe",
      visibleHotSpots: "always"
   });

   centerdiv();
   $(window).resize(centerdiv);





   $scrollers.css('opacity', 0.01);


   $div.hover(
      function(){
         $scrollers.fadeTo(500, 0.5);
      },
      function(){
         $scrollers.fadeTo(500, 0.01);

      }
   );


   $scrollers.hover(
      function(){
         $scrollers.fadeTo(500, 0.5);
         startScroll = false
      },function(){
         startScroll = false
         setTimeout(function(){
            if (startScroll==false){
               $scrollers.fadeTo(500, 0.01);
            }
         },500);
      }
   );


   var fadingComplete = false;
   $('#logo img').hover(
      function(){
         fadingComplete = false;
         $('#makeMeScrollable').fadeOut(300, function(){
            $('#monica').fadeIn(300, function(){
               fadingComplete = true;
            });
         });
      }
   );

   $('.back').click(function(){
      fadingComplete = false;
      $('#monica').fadeOut(300, function(){
         $('#makeMeScrollable').fadeIn(300, function(){
            fadingComplete = true;
         });
      });
      return false;
   })


});

function centerdiv(){
   var top = ($(window).height()-560);
   if (top > 0){
      $('#wrapper').css('margin-top', (top/2)+'px');
   }
   else{
      $('#wrapper').css('margin-top', '0px');
   }
}