var menutimeout = 100;
var closetimer = 0;
var thesubmenu = null;

  
$(document).ready(function () {
	init();
});

function init() {
  
  positionMenu();
  scaleFigures();
  sizeSubmenuItems();
  closeSubmenus();
  $('*').click(function() {closeSubmenus();});
  $('.subnav').each(
      function () {
        var themenu = $(this); 
        $(this).parent().mouseover(
          function() {
            showMenu(themenu);
          }
        ); 
        $(this).parent().mouseleave(
          function() {
            closeSubmenuBuffer(themenu);
          }
        );
      }
  );
  
  $(".slideshowwindow img").each(function(){scaleToSlideshow(this)});
  $(".slideshow").jCarouselLite({
    auto:3000,
        speed: 500,
    btnNext: ".next",
    btnPrev: ".prev"
  });
  
  $(window).load(function() {
  	sizeSidebar();
  });
}

function scaleToSlideshow(slshowimg) {
  var box = slshowimg.parentNode.parentNode;
  var boxwidth = $(box).outerWidth();
  var imgInitX = $(slshowimg).outerWidth();
  var imgInitY = $(slshowimg).outerHeight();
  var imgInitRatio = imgInitX/imgInitY;
  if (imgInitRatio>1) {
    slshowimg.style.width = boxwidth + 'px';
    imgNewY = Math.ceil(boxwidth/imgInitRatio);
    slshowimg.style.height = imgNewY + 'px';
    $(slshowimg).css('margin-top',Math.ceil((boxwidth - imgNewY)/2) + 'px');
  } else {
    slshowimg.style.height = boxwidth + 'px';
    imgNewX = Math.ceil(boxwidth*imgInitRatio);
    slshowimg.style.width = imgNewX + 'px';
    $(slshowimg).css('margin-left',Math.ceil((boxwidth - imgNewX)/2) + 'px');
  }
}

function sizeSidebar() {
  var targetLayer = document.getElementById('side');
  var targetHeight = $('#page').outerHeight();
  var sidePadding = $('#side').outerHeight() - $('#side').height();
  if (targetHeight > $('#side').outerHeight() - sidePadding) {
  	targetLayer.style.height = targetHeight - sidePadding + 'px';
  }
}

function scaleFigures() {
  var figurelist = document.getElementById('figures');
  if(figurelist){
    var figures = figurelist.getElementsByTagName('img');
    if (figures.length>0) {
      for (var i=0; i<figures.length; i++) {
        scaleAndCrop(figures[i]);
      }
    }
  }
}


function scaleAndCrop(image) {
  if (document.getElementById) {
    var imgobject = image;
    var boundingbox = imgobject.parentNode;
    var boundscropY = $(boundingbox).outerHeight();
    var boundscropX = $(boundingbox).outerWidth();
    var boundsratio = boundscropX/boundscropY;
    boundingbox.style.position = 'relative';    
    boundingbox.style.overflow = 'hidden';    
    var imgheight = $(imgobject).outerHeight();
    var imgwidth = $(imgobject).outerWidth();
    var imgratio = imgwidth/imgheight;
    var imgoverflow = 0;
    if (imgratio>boundsratio) {
      imgobject.style.height=boundscropY + 'px';
      imgobject.style.width=(imgratio*boundscropY) + 'px';
      imgoverflow = (imgratio*boundscropY) - boundscropX;
      imgobject.style.position='relative';
      imgobject.style.left='-' + (imgoverflow/2) + 'px';
    } else {
      imgobject.style.width=boundscropX + 'px';
      imgobject.style.height=(boundscropX/imgratio) + 'px';
      imgoverflow = (boundscropX/imgratio) - boundscropY;
      imgobject.style.position='relative';
      imgobject.style.top='-' + (imgoverflow/2) + 'px';
    }
  }
}


// this used to scale images both up and down, but I felt that up-scaling too often produced bad-looking photos, so it only scales down to fit now. Hopefully editors will just submit high enough quality images in the future so they will always fill the div.
function scaleToFit(image) {
  if (document.getElementById) {
        var imgobject = image;
        var boundingbox = findParentDiv(imgobject);
        var boundscropX = $(boundingbox).outerWidth();
        var boundscropY = $(boundingbox).outerHeight();
		var boundsratio = boundscropX/boundscropY;
        
		if ( $.browser.msie ) {
		   doscale();
		} else {
		   $(imgobject).load(function(){doscale();});
		}

        function doscale() {      
			// reset img props
			imgobject.style.width = '';
			imgobject.style.height = ''; 
			imgobject.style.marginTop = '';
			imgobject.style.marginLeft = ''; 
			var imgheight = $(imgobject).outerHeight();
			var imgwidth = $(imgobject).outerWidth();
			var imgratio = imgwidth/imgheight;
			if (imgratio>boundsratio) {
			  imgobject.style.width=boundscropX + 'px';
			  var h = (boundscropX/imgratio);
			  imgobject.style.height = h + 'px';
			  imgobject.style.marginTop=((boundscropY - h) /2) + 'px';
			} else {
			  imgobject.style.height=boundscropY + 'px';
			  var w = (imgratio*boundscropY);
			  imgobject.style.width=w + 'px';
			  imgobject.style.marginLeft=((boundscropX - w) /2) + 'px';
			}
        }
    }
}

function findParentDiv(start) {
  var parentdiv=start.parentNode
  if (parentdiv.nodeName != 'DIV') {
    parentdiv = parentdiv.parentNode;
  }
  return parentdiv;
}

function fitImages() {
  var images = document.getElementsByTagName("img");
  for (var i=0; i<images.length; i++) {
    if (images[i].className == "fitimage") {
        scaleAndCrop(images[i]);
    } else if (images[i].className == "scalewidth") {
        scaleToFit(images[i],"x");
    }  else if (images[i].className == "scaleheight") {
        scaleToFit(images[i],"y");
    } 
  }  
}


function positionMenu() {
  var boxheight = $('#nav').height();
  var menuheight = $('#nav li a:first').outerHeight();
  $('#nav #menu').css('margin-top', boxheight - menuheight + 'px');
}

function sizeSubmenuItems() {
  var widest = 0;
  $('#menu .subnav li').each(
    function() {
      widest = $(this).parent().outerWidth();
      $(this).css('width',widest);
    }
  );
  $('#menu .subnav .subnav').each(
    function() {
      offset = $(this).parent().outerWidth();
      $(this).css('left',offset -1 + 'px');
    }
  );
  $('#menu .subnav li a').each(function(){var diff = $(this).outerWidth() - $(this).width();$(this).css('width', ($(this).parent().outerWidth() - diff) + 'px')});
  
}

function showMenuBuffer(menu) {
  cancelTimer();
  thesubmenu = menu;
  closetimer = window.setTimeout(showMenu,menutimeout);
}

function showMenu() {
  $(thesubmenu).css('visibility','visible');
}

function showMenu(themenu) {
  $(themenu).css('visibility','visible');
}

function closeSubmenuBuffer(whichMenu) {
  cancelTimer();
  thesubmenu = whichMenu;
  closetimer = window.setTimeout("closeSubmenu()",menutimeout)
}

function closeSubmenu() {
  $(thesubmenu).css('visibility','hidden');
}

function cancelTimer() {
  if(closetimer) {  
    window.clearTimeout(closetimer);
    $(thesubmenu).css('visibility','hidden');
    closetimer = null;
    thesubmenu = null;
  }
}

function closeSubmenusBuffer() {
  cancelTimer();
  closetimer = window.setTimeout("closeSubmenus",menutimeout);
}

function closeSubmenus() {
  $('#menu .subnav').css('visibility','hidden');
}