$(document).ready(function(){

  var cache = [];

  // Arguments are image paths relative to the current page.

  $.preLoadImages = function() {

    var args_len = arguments.length;

    for (var i = args_len; i--;) {

      var cacheImage = document.createElement('img');

      cacheImage.src = arguments[i];

      cache.push(cacheImage);

    }

  }

  jQuery.preLoadImages("images/menu_thuis_on.png","images/menu_thuis_off.png","images/menu_over_on.png","images/menu_over_off.png","images/menu_werk_on.png","images/menu_werk_off.png","images/menu_adres_on.png","images/menu_adres_off.png","images/bkg_upper2.png","images/bkg_upper3.png","images/bkg_upper4.png","images/bkg_over.png","images/bkg_adres.png","images/client_list_on.png","images/overzicht_on.png","images/overzicht_menu_1_on.png","images/overzicht_menu_2_on.png","images/overzicht_menu_3_on.png","images/overzicht_menu_4_on.png","images/overzicht_menu_5_on.png","images/overzicht_menu_6_on.png");
  
  $('.menu_a#menu_'+$('#upper').attr('active')).addClass('menu_a_on');

  $('.menu_a').hover(

  	function() {

  	  $('.menu_a').removeClass('menu_a_on');

      $(this).addClass('menu_a_on');

  		$('.menu_left').html($(this).children("span").html());

  		$('.menu #menu_1 img').attr('src','images/menu_thuis_off.png');

  		$('.menu #menu_6 img').attr('src','images/menu_werk_off.png');

  		$('.menu #menu_3 img').attr('src','images/menu_over_off.png');

  		$('.menu #menu_4 img').attr('src','images/menu_adres_off.png');

      $(this).children("img").attr('src',$(this).children("img").attr('src').replace('_off.png','_on.png'));

  	},

  	function() {

      $('.menu_a').removeClass('menu_a_on');

      $('.menu_a#menu_'+$('#upper').attr('active')).addClass('menu_a_on');

      $('.menu_left').html($('.menu_a#menu_'+$('#upper').attr('active')).children("span").html());

      $('.menu #menu_1 img').attr('src','images/menu_thuis_off.png');

  		$('.menu #menu_6 img').attr('src','images/menu_werk_off.png');

  		$('.menu #menu_3 img').attr('src','images/menu_over_off.png');

  		$('.menu #menu_4 img').attr('src','images/menu_adres_off.png');

      $('.menu_a#menu_'+$('#upper').attr('active')).children("img").attr('src',$('.menu_a#menu_'+$('#upper').attr('active')).children("img").attr('src').replace('_off.png','_on.png'));

    }

  );

  $('.menu_d').hover(

  	function() {

  	  if ($(this).attr('id') == 'menu_5') {

        $('.menu_d#menu_5 img').attr('src','./images/client_list_on.png');

        $('.menu_d#menu_6 img').attr('src','./images/overzicht.png');

      } else if ($(this).attr('id') == 'menu_6') {

        $('.menu_d#menu_5 img').attr('src','./images/client_list.png');

        $('.menu_d#menu_6 img').attr('src','./images/overzicht_on.png');

      }

  	},

  	function() {

      if ($('#upper').attr('active') == 5) {

        $('.menu_d#menu_5 img').attr('src','./images/client_list_on.png');

        $('.menu_d#menu_6 img').attr('src','./images/overzicht.png');

      } else if ($('#upper').attr('active') == 6) {

        $('.menu_d#menu_5 img').attr('src','./images/client_list.png');

        $('.menu_d#menu_6 img').attr('src','./images/overzicht_on.png');

      }

    }

  );

  $(".upper_content").css('display','none');

  $(".overzicht_content").css('display','none');

  $(".overzicht_menu").css('display','none');

  $('.overzicht_menu').hover(

    function(){

      $(this).attr('src',$(this).attr('src').replace('_off.png','_on.png'));

    },

    function(){

      if ($('#upper').attr('overzicht') != $(this).attr('id').replace('overmenu_','')) {

        $(this).attr('src',$(this).attr('src').replace('_on.png','_off.png'));

      }

    }

  );

  $('.overzicht_content span').click(function() {

    showOverzicht($(this).parent().attr('id').replace('overzicht_',''),$(this).html());

    $('.overzicht_content span').css('color','#868686');

    $(this).css('color','#5bab26');

  })

  $('#content_2 input').focus(function() {

    if ($(this).val() == 'gebruikersnaam' || $(this).val() == 'wachtwoord' || $(this).val() == 'emailadres') {

      $(this).val('');

    }

  });
  
    $("#bkg_container").css('background','transparent');

    $(".down_content#content_6").css('background','transparent');

    $('.menu_d#menu_5 img').attr('src','./images/client_list.png');

    $('.menu_d#menu_6 img').attr('src','./images/overzicht_on.png');

    $(".overzicht_menu").css('display','block');

    $(".down_content").css('display','none');

    $(".down_content#content_6").css('display','block');

    showOverzicht(1,0);

})

function toggleBkg(p) {

  $('#upper').attr('active',p);

  if (p == 1) {

    goUp();

    if ($('#upper').attr('offset') == 1) {

      var i = 2;

    } else if ($('#upper').attr('offset') == 2) {

      var i = 3;

    } else if ($('#upper').attr('offset') == 3) {

      var i = 4;

    } else if ($('#upper').attr('offset') == 4) {

      var i = 1;

    }

    $('#upper').attr('offset',i);

    $(".upper_content").css('display','none');

    $('#upper').css('background','url(./images/bkg_upper'+i+'.png) transparent center bottom no-repeat');

  } else if (p == 2) {

    goUp();

    $('#upper').css('background','url(./images/bkg_over.png) transparent center bottom no-repeat');

    $(".upper_content").css('display','none');

    $(".upper_content#content_2").css('display','block');

  } else if (p == 3) {

    goUp();

    $('#upper').css('background','url(./images/bkg_over.png) transparent center bottom no-repeat');

    $(".upper_content").css('display','none');

    $(".upper_content#content_3").css('display','block');

  } else if (p == 4) {

    goUp();

    $('#upper').css('background','url(./images/bkg_adres.png) transparent center bottom no-repeat');

    $(".upper_content").css('display','none');

    $(".upper_content#content_4").css('display','block');

  } else if (p == 5) {

    goDown();

    $("#bkg_container").css('background','transparent');

    $('.menu_d#menu_5 img').attr('src','./images/client_list_on.png');

    $('.menu_d#menu_6 img').attr('src','./images/overzicht.png');

    $(".overzicht_menu").css('display','none');

    $(".down_content").css('display','none');

    $(".down_content#content_5").css('display','block');

  } else if (p == 6) {

    goDown();

    $(".overzicht_content").css('display','none');

    $("#bkg_container").css('background','transparent');

    $(".down_content#content_6").css('background','transparent');

    $('.menu_d#menu_5 img').attr('src','./images/client_list.png');

    $('.menu_d#menu_6 img').attr('src','./images/overzicht_on.png');

    $(".overzicht_menu").css('display','block');

    $(".down_content").css('display','none');

    $(".down_content#content_6").css('display','block');

    showOverzicht(1,0);

  }

}



function showOverzicht(p,s) {

  $(".overzicht_menu#overmenu_"+$("#upper").attr('overzicht')).attr('src',$(".overzicht_menu#overmenu_"+$("#upper").attr('overzicht')).attr('src').replace('_on.png','_off.png'));

  $("#upper").attr('overzicht',p);

  $(".overzicht_menu#overmenu_"+p).attr('src',$(".overzicht_menu#overmenu_"+p).attr('src').replace('_off.png','_on.png'));

  $(".overzicht_content#overzicht_"+p+" span:last").css('border','0px');

  if (s == 0) { $('.overzicht_content span').css('color','#868686'); var s = $(".overzicht_content#overzicht_"+p+" span:first").html(); $(".overzicht_content#overzicht_"+p+" span:first").css('color','#5bab26'); }

  $(".overzicht_content#overzicht_"+p+" div").css('display','none');
  
  $(".overzicht_content#overzicht_"+p+" div[name='"+s+"']").css('display','block');
  
  $(".overzicht_content").css('display','none');

  $(".overzicht_content#overzicht_"+p).css('display','block');

  $(".down_content#content_6").css('background','url(./images/overzicht/overzicht_'+p+'_'+s+'_left.png) transparent right top no-repeat');

  $("#bkg_container").css('background','url(./images/overzicht/overzicht_'+p+'_'+s+'_down.png) transparent left bottom no-repeat');

}



function goDown() {

  $('html').animate({scrollTop:635}, 'slow', function() {

    if ($('html').scrollTop() == 0) {

      $(window).scrollTop(635);

    }

  });

}



function goUp() {

  $('html').animate({scrollTop:0}, 'slow', function(){

    $(window).scrollTop(0);

  });

}
