// this stuff fires after all page elements are fully loaded (including images)
$(window).load(function(){

  // this is the accordion effect on the navigation menu
  $('ul#nav ul').prev('a').css({ cursor: "pointer" }).click(function() {
    // first, start any open ones closing
    $('ul#nav ul').stop().hide(800);
    // next, compress the menu items
    // only do it if not already done
    if ($('ul#nav li#home').css('marginBottom') != "2px") {
      $('ul#nav > li').animate({ marginBottom: "2px" }, 800);
    }
    // last, open up the one clicked
    $(this).next('ul').stop().show(800);
  });
  
});


function imageLoader() {

  do{
    var nextImageNum = Math.floor(Math.random()*28)+1;
  // } while ( 'background_images/rotation-'+nextImageNum+'.jpg' == $(prevImage).attr('src') );
  } while ( false );
  
  var img = new Image();
  $(img).load(function(){
   
    // add the new image and animate
    $('<div style="width: 0; height: 0; top: -150px;"><img src="' + $(this).attr('src') + '" /></div>').appendTo($("div#images div.container"));
    
    var i=1;
    for (i=1;i<=4;i++) {
      var j=1;
      for (j=1;j<=4;j++) {
        $("div#images div.container.row"+i+".col"+j+" div:last").animate({ opacity: 1.0 }, 300*(i+j)).animate({ width: "180px", height: "150px"}, 1500, "swing", function(){
          $(this).prev().hide();
          $(this).css({ top: "0" }); 
        });
        if (i==4 && j==4) {
          $("div#images div.container.row4.col4 div:last").animate({ opacity: 1.0 }, 2000, "swing", imageLoader);
        }
      }
    }
    
  }).attr('src', 'background_images/rotation-'+nextImageNum+'.jpg');
  
}