var lastLoadedId;
$(document).ready(function() {
  
  if($("body").hasClass("splash")) {
    $("body.splash #splash").css("top", ($(window).height()/2 - $("#splash").height()/2)+"px");
    setInterval(function() {$("body.splash #splash").fadeOut(1000, function(){
       $("html").css("background-color", init_bg_color); window.location=redirect_url;
    })}, 2000);
  } else {
    pageInit();
  }
});

function pageInit () {
  
  $("body").removeClass("splash");
  
  if($("#carousel li").length > 10) {
    jQuery('#carousel').jcarousel({scroll: 8});
  } else {
    jQuery('#carousel').addClass("thumbs");
  }
  
  $("li.thumb img").click(function() {
    var image_id = $(this).attr("id");
    loadImage(image_id);
    $("li.thumb img").css('opacity', 0.5);
    $(this).css('opacity', 1);
    return false;
  });
  
  $("li.dropdown").bind("mouseover mouseout", function(event) {
    $(this).toggleClass("hover");
    transform($("ul.categories li:first"));
  });
  
  $(document).pngFix();
}

function loadImage(imageId) {
  
  var response = $.getJSON("/getimagejson.php", {'do':"getimagedata", id: imageId}, function(data) {
    
    var imageEl = $("#showing");
    var frame = $("#display");
    var placeholder = $("#placeholder");
    var imgPath = portfolio_path+"/"+data.slug+"/"+data.filename+"?"+Math.random();
    var img = new Image(); img.src = imgPath;
    lastLoadedId = data.id;
    // var img = new Image();
    
    imageEl.fadeOut("fast", function() { // Load image and show when complete
      
      $(img).load(function() {
        // console.log(data.id+','+lastLoadedId);
        if(data.id==lastLoadedId) {
          $("html").css("background-color", data.color);
          placeholder.width(parseFloat(data.width));
          placeholder.height(parseFloat(data.height));
          imageEl.attr("src", imgPath);
          // imageEl.show();
          imageEl.fadeIn();
          // setTimeout(function(){imageEl.fadeIn()}, 500);
        }
      });
    });
    
  });
}

function transform(starter) {
  starter.animate({opacity: 1.0}, 300, function(){
    transform(starter.next());
  });
}