// replace fonts
	  Cufon.replace('p', {autoDetect: true});
	  Cufon.replace('h2', {autoDetect: true});
	  Cufon.replace('a', {autoDetect: true});

// create paths for animation
var SineWave = function() {
  this.css = function(p) {
    var s = Math.sin(p*3)
    var x = 150 - p * 800
    var y = s * 08 + 200
    return {top: y + "px", left: x + "px"}
  }
};

var SineWave2 = function() {
  this.css = function(p) {
    var s = Math.sin(p*4)
    var x = -600 + p * 700
    var y = s * 30 + 200
    return {top: y + "px", left: x + "px"}
  }
};


var SineWave3 = function() {
  this.css = function(p) {
    var s = Math.sin(p*3)
    var x = 0 - p * 800
    var y = s * 08 + 200
    return {top: y + "px", left: x + "px"}
  }
};

var SineWave4 = function() {
  this.css = function(p) {
    var s = Math.sin(p*4)
    var x = -800 + p * 700
    var y = s * 30 + 200
    return {top: y + "px", left: x + "px"}
  }
};
$(document).ready(function() {

$('#text, #logo, #image').hide();
// check ie6 > replace png -> gif
  if($.browser.msie && $.browser.version=="6.0") {
    $('#spot').attr('src', 'http://www.geldmuseum.nl/museum/sites/all/themes/Eyecatchers/images/spot2.gif');
  };

// set body width and overflow for smooth animation
  $('body').css({width : '9000px'});
  $('body').css({height: '3000px'});

if ($(window).width() > '1024') {
    $('body, html').css({overflow : 'hidden'});
  } else {
    $('#banner img').css({width: '900px'});
    SineWave = SineWave3;
    SineWave2 = SineWave4;
  }

// hide menu, intro, banner (pause for pageloading)
  $('#menu').hide();
  $('#intro').hide();
  $('#banner img').hide();
  $('.skip').show();

//show banner
  setTimeout("$('#banner img').fadeIn('fast');", 1000);

//animate spotlight
  setTimeout('$("#spot").animate({path : new SineWave}, 2500);', 1000);
  setTimeout('$("#spot").animate({path : new SineWave2}, 2500);', 3500);

// unfocus spotlight and fadeout (=show complete banner)
  setTimeout("$('#spot').animate({width : '6200px', height: '400px', marginLeft: '-1550px'}, 200);", 6000);
  setTimeout("$('#spot').fadeOut('fast');", 6000);

// show text and menu
  setTimeout('$("#intro").fadeIn()', 8000) ;
  setTimeout('$("#menu").fadeIn()', 9000) ;

// show intro2
$('#intro').click(function() {
	$('#intro').fadeOut();
	setTimeout("$('#intro2').fadeIn();", 500);
});


// show intro3
$('#intro2').click(function() {
	$('#intro2').fadeOut();
	setTimeout("window.location = 'http://www.geldmuseum.nl/museum/node/1834'",500);
});

// animate menu
  $('#menu ul li').hover(function() {
        $(this).children('a').stop().animate({
          color: "#fff"
        }, 450);
          $(this).children('.second-level').stop().animate(
            {height: '100px'}, {duration: 500}
          );
    }, function() {
        $(this).children('a').stop().animate({
          color: "#4f4c4d"
        }, 450);
          $(this).children('.second-level').stop().animate(
            {height: '0'}, {duration: 500}
          );
    });

})