var ratios;
var ajaxloaded = false;

//$(".resizeme").css("visibility","hidden");

//$(".resizeme").load(function() {
//   $(this).css("visibility","visible");
//});

$(document).ready(function() {
   //alert('DOM ready');
   resizeCanvas();
   hideLoadingImages();
   
   if($("#picheights").length){
      ratios = determineRatios();
   }

   $(".resizeme").css("visibility","visible");

   //if(genRandom(0,50) == 11){
   //   // yoohoo!
   //   document.body.style.MozTransform="rotate(180deg)";
   //}

});


$(window).load(function() {
   //alert('content loaded');
   resizeContent();

       // thumbs
    //$(".resizeme").aeImageResize({height:100, width: 100});
});

$(window).resize(function() {
   resizeCanvas();
   resizeContent();
});

function genRandom(min,max){
   return Math.floor((max - (min-1)) * Math.random()) + min;
}

function resizeCanvas() {
   debuglog('Resizing canvas..');
   var h = $(window).height();
   var w = $(window).width();

   if($("#items").length){
      $("#items").css('height', h - 119);
      $("#items").css('width', w );
   }
   if($("#projects").length){
      $("#projects").css('height', h - 94);
      $("#projects").css('width', w);
   }
   debuglog('Done');
}

function hideLoadingImages(){

      // hide the images of class image_item (because they are still loading)
   var imgs    = $('img.image_item');

   for (var i =0; i < imgs.length; i++){
      $(imgs[i]).css('display','none');      
   }
      // show the images of class loadinggif
   imgs = $('img.loadinggif');

   for (var i =0; i < imgs.length; i++){
      $(imgs[i]).css('display','inline');      
   }
   
}

function determineRatios() {

   debuglog('Determining ratios..');
   var maximgh = 0;
   var imghs   = $('#picheights').val();

   //debuglog("picheights: " + imghs);
   
   imghs       = imghs.split(',');
   
      // determine heighest value of image height
   for(var i=0; i < imghs.length; i++){
      if(imghs[i] > maximgh) {
         maximgh = imghs[i];
      }
   }

      // determine ratios
   ratios      = new Array();
   
   //debuglog("maximgh: "+ maximgh);

   for (i=0; i < imghs.length; i++){
      //debuglog("imgh: " + imghs[i]);
      if(maximgh == 0) ratios[i] = 1;
      else
      ratios[i] = imghs[i] / maximgh;
      //debuglog("ratio " + i + ": " + ratios[i]); 
   }
   debuglog('Done');
   return ratios;
}

function resizeContent() {

   debuglog('Resizing content..');
   var r           = 175;  // vertical portion of page in pixels, that is not to be used for the image
   var maximageh   = 550;  // largest image should never have a height higher than this value
   var minimageh   = 100;  // largest image should never have a height lower than this value
   var aspectRatio = 1;
   var w           = $(window).width();
   var h           = $(window).height();
   var hnew1;
   var hnew        = h - r;
   hnew            = Math.min(maximageh,hnew);
   hnew            = Math.max(minimageh,hnew);

   // resize image items

   var imgs     = $('img.image_item');
   var loadings = $('img.loadinggif');

   for (var i =0; i < imgs.length; i++){

         // determine the new height
      hnew1 = parseInt(hnew * ratios[i]);
      //debuglog(i +" new height: " + hnew1);

         // set the image to the new height
      $(imgs[i]).css('height',hnew1);
      //debuglog('hiding loading ' + i);

         // hide the 'loading..' image
      $(loadings[i]).css('display','none');

         // show the image       
      $(imgs[i]).css('display','inline');      
      //debuglog(i +" should now be visible again");
   }

   // resize embedded content

   var objs = $("object, embed");

   for (var i = 0; i < objs.length; i++){

      if($(objs[i]).attr("height") > hnew) {

         aspectRatio = $(objs[i]).attr("width") / $(objs[i]).attr("height");

         $(objs[i]).width(hnew * aspectRatio)
                   .height(hnew);  
      }
   }
   debuglog('Done.');
}

function ajaxload(id,lang) {

  return false; // disabled because it gives more problems than benefits..

  try {

     document.getElementById('content2').innerHTML = '<div style="position:absolute;top:100px;left:100px;"><img src="./images/loading.gif" alt="loading"/></div>';

     $('#content1').css('display','none');
     $('#content2').css('display','block');

     $('#content2').load('content.php?getcontent='+id+'&lang='+lang,function() {
        resizeCanvas();
        ratios = determineRatios();
        resizeContent();
      });
     ajaxloaded = true;
     //alert('ajaxloaded');
     return true;

  } catch(err) {
     return false;
  } 
}

function showOverview(){
   if(ajaxloaded){
     $('#content2').css('display','none');
     $('#content1').css('display','block');
     debuglog('ajaxload');
     return true;
   }
   return false;
}

function debuglog(msg) {

   //var db = document.getElementById('debugoutput');
   //db.innerHTML = msg + "\n" + db.innerHTML;
   //db.innerHTML += msg + "\n";
}