$(function(){
  mask($("#left_category_menu"));
  mask($("#right_category_menu"));

  // remove any empty blocks from the DOM
  $("#homepage_panels ul li").each(function(){ if( $( this ).find( "img" ).length == 0 ){ $(this).remove() } } )

  // hide all the blocks
  $("#homepage_panels ul li").hide()

  // show the first block
  $("#homepage_panels ul li").first().show();

  setInterval ( nextImage, 5000 );
});

function nextImage(){

  current = $("#homepage_panels ul li:visible")
  next = current.next()
  if( next.length == 0 ){ next = $("#homepage_panels ul li").first() }

  current.fadeOut(); next.fadeIn();

}

function mask(element){

  element = element[0]

  mask_id = element.id + "_mask"
  $(element).offsetParent().append("<div id='" + mask_id + "' />")

  mask_element = $( "#" + mask_id )
  mask_element.addClass("category_menu_mask")
  mask_element.css("position", "absolute")
  mask_element.height( $(element).outerHeight() )
  mask_element.width( $(element).outerWidth() )

  parent_position = $(element).position()
  mask_element.css( "left", parent_position.left )
  mask_element.css( "top", parent_position.top )

}

