window.onload = function() {
  setContentHeight();
  imageReplacement();
}
window.onresize = function() {
  setContentHeight();
}

/* Footer positioning based on "Exploring Footers" by Bobby van der Sluis <http://www.bobbyvandersluis.com/> */

function getWindowHeight() {
  var windowHeight = 0;
  if (typeof(window.innerHeight) == 'number') {
    windowHeight = window.innerHeight;
  } else {
      if (document.documentElement && document.documentElement.clientHeight) {
        windowHeight = document.documentElement.clientHeight;
    } else {
      if (document.body && document.body.clientHeight) {
        windowHeight = document.body.clientHeight;
      }
    }
  }
  return windowHeight;
}

function setContentHeight() {
  var windowHeight = getWindowHeight();
  var footerElement = document.getElementById('footer');
  var contentElement = document.getElementById('content');
  var linksElement = document.getElementById('links');
  if (windowHeight && footerElement && contentElement && linksElement) {
    var footerTop = footerElement.offsetTop;
    var footerHeight = footerElement.offsetHeight;
    var contentHeight = contentElement.offsetHeight;
    var linksHeight = linksElement.offsetHeight;
    if (contentHeight < linksHeight) {
      contentElement.style.height = linksHeight;
    }
    if (windowHeight - (footerTop + footerHeight) >= 0) {
      contentElement.style.height = windowHeight - (footerTop + footerHeight) +
          (contentHeight > linksHeight ? contentHeight: linksHeight) + 'px';
    }
  }
}

function loadImage(h) {
  var img = new Image();
  var src = "/img/" + h.firstChild.nodeValue.toLowerCase().replace(/ +/g, "-").replace(/[^a-z0-9-]+/g, "") + ".png";

  function replaceImage() {
    var e = document.createElement('img');
    e.src = src;
    e.alt = h.firstChild.nodeValue;
    h.replaceChild(e, h.firstChild);
  }

  img.onload = replaceImage;
  img.src = src;
}

function imageReplacement() {
  if (document.getElementsByTagName && document.createElement) {
    for (var level = 1; level <= 6; level += 1) {
      var header = document.getElementsByTagName('h' + level);
      for (var i = 0; i < header.length; i += 1) {
        if (header[i].className == "image") loadImage(header[i]);
      }
    }
  }
}