(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);
	  //console.log(arguments[i]);
    }
  }
})(jQuery)

$(document).ready(function(){

	dark = false;
	$('.dark').hide();

	$('#navigation a.clickable img').each(function() {
		//console.log('looping');
		source = $(this).attr('src').split('-');;
		//$.preLoadImages(source[0] + '-ON.png', source[0] + '-DARK.png');
		$.preLoadImages(source[0] + '-ON.png');
	});

	$('#navigation a.clickable').hover(function(){
		$target = $(this).find('img:first');

		if(dark){
			$dark = $(this).find('img:last');

			$dark.show().fadeTo(1000, 0);
		}

		source = $target.attr('src').split('-');
		source = source[0] + '-ON.png';
		$target.attr('src', source);
	},
	function(){
		$target = $(this).find('img:first');

		if(dark){
			$dark = $(this).find('img:last');

			$dark.hide()
		}

		source = $target.attr('src').split('-');
		source = source[0] + '-OFF.png';
		$target.attr('src', source);
	});

});