var bAnimatingIn  = false;
var bAnimatingOut = false;
var Timer = "";

$(document).ready(function() {
  Cufon.replace('#banner_content .banner_txt', { fontFamily: 'MyriadPro' });
  initAnimation();
  
  //show animation
  setTimeout(function() {
    $("#banner_content").trigger("mouseover");
  }, 1500);
});

function initAnimation() {
  var paper = Raphael("banner", 400, 310);     
  
  var Ellipse = paper.ellipse(290, 230, 100, 60);
  Ellipse.attr({"fill": "#ffffff",
          //"fill-opacity": 0.75,
          "fill-opacity": 0.90,
          //"stroke": "#b1005d",
          "stroke": "#C6930A",
          "stroke-width": 5,
          "rotation": 10
  });  
  
  var Logo = paper.image("http://www.vivre.nl/pics/top10/logo.png", 225, 180, 138, 95);   
  
  $("#banner_content").hover(function(event){
    Animate_Ellipse_In(Ellipse, Logo);  
  }, function(event){
    Animate_Ellipse_Out(Ellipse, Logo);  
  });   
}


function Animate_Ellipse_In(Ellipse, Logo) { 
    if(!bAnimatingIn && !bAnimatingOut)
    {
      bAnimatingIn = true;  
      Ellipse.animate({cx: 200, cy: 160, rx: 200, ry: 130}, 300);   
      Logo.animate({x: 180, y: 180}, 300, function() {
        $("#banner_content .banner_txt").fadeIn(200, function() { bAnimating = false; });    
      
        /* Stars */
        $("#banner_content .stars_big .star1").fadeIn(200, function() {
          $("#banner_content .stars_big .star6").fadeIn(200, function() {
            $("#banner_content .stars_big .star7").fadeIn(200);  
            
            $("#banner_content .stars_big .star5").fadeIn(200, function() {
              
              $("#banner_content .stars_big .star3").fadeIn(200, function() {
                $("#banner_content .stars_big .star4").fadeIn(200, function() {
                  $("#banner_content .stars_big .star2").fadeIn(200);   
                }); 
              });
              
              $("#banner_content .stars_big .star8").fadeIn(200, function() {
                $("#banner_content .stars_big .star9").fadeIn(200, function() { bAnimatingIn = false;  });   
              });
            });
          });          
        });
        /* End stars */    
      });
      
      Timer = setTimeout(function() {
        $("#banner_content").trigger("mouseout");   
      }, 10000); 
    } 
}                        

function Animate_Ellipse_Out(Ellipse, Logo) {
    clearTimeout(Timer);  
    if(!bAnimatingIn && !bAnimatingOut) {
      bAnimatingOut = true;
      $("#banner_content .stars_big img").fadeOut(100);
      
      $("#banner_content .banner_txt").fadeOut(50, function() { 
        Ellipse.animate({cx: 290, cy: 230, rx: 100, ry: 60}, 300);  
        Logo.animate({x: 225, y: 180}, 300, function() { bAnimatingOut = false; });   
      });    
    }                                                                
}
