var full = {}, numFull = 0, currentHash = location.hash;

function css(el,rule,value) {
  getEl(el).style[rule] = value;
}
function attr(el,name,value) {
  el = getEl(el);
  if (value)
    el.setAttribute(name, value);
  return el.getAttribute(name);
}
function html(el,htmlText) {
  el = getEl(el);
  if (htmlText)
    el.innerHTML = htmlText;
  return el.innerHTML;
}
function getEl(el) {
  if (el.nodeType)
    return el;
  return document.getElementById(el);
}
function show(el,inline) {
  css(el, 'display', inline ? 'inline' : 'block' );
}
function hide(el) {
  css(el, 'display', 'none' );
}

function loadFull(item,hash) {
  var loaded, video = getEl('video-video'), width = 528, height;
  height = parseInt(item.src.substr(item.src.indexOf(width+'x')+4,3)) + 16;
  if (document.all) {
    html('video-video', 
      '<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"\
      width="'+width+'" height="'+height+'" bgcolor="#000000">\
      <param name="src" value="'+item.src+'" >\
      <param name="controller" value="true" >\
      <param name="autoplay" value="false">\
      <param name="kioskmode" value="true">\
      </object>');
  } else {
    html('video-video',
      '<object type="video/quicktime" data="'+item.src+'" width="'+width+'" height="'+height+'" bgcolor="#000000">\
      <param name="controller" value="true" >\
      <param name="autoplay" value="false">\
      <param name="kioskmode" value="true">\
      </object>');
  }
  
  html('video-video-caption', html('caption'+hash));
  html('subheader-title', html('subheading'+hash));
  show('video-panel');
  
}

function pageload(hash) {
  if (hash && (hash = hash.substring(1))) {
    var pos = full[hash].pos;
    loadFull(full[hash],hash);
    hide('portfolio-panel');
    html('subheader-count', (pos<10?'0':'')+pos+'/'+(numFull<10?'0':'')+numFull);
    show('subheader-count',true);
    attr('subheader-prev','href','#'+full[hash].prev);
    attr('subheader-next','href','#'+full[hash].next);
    show('subheader-controls',true);
  } else {
    hide('subheader-count');
    hide('subheader-controls');
    hide('video-panel');
    show('portfolio-panel');
    html('subheader-title', ' ');
  }
}

var readyFired = false;
function onReady() {
  
  if (readyFired)
    return;
  
  readyFired = true;
    
  var lastHash = '', hash = '', thumbs = getEl('portfolio-panel').getElementsByTagName('A'), 
    thumbCount = thumbs.length, i, a;
  
  for (i = 0; i < thumbCount; i++) {
    a = thumbs[i];
    if (a.className == 'thumb') {
      numFull++;
      hash = a.name.substring(2);
      full[hash] = {
        'src':a.href,
        'pos': i+1,
        'type':a.rel,
        'prev':lastHash,
        'next':''
      };
      if (lastHash) {
        full[lastHash].next = hash;
      }
      lastHash = hash;
      a.href = '#'+hash;
    } 
  }
  
      
  if (currentHash)
    pageload(currentHash);
  
  setInterval(function() {
    if (location.hash != currentHash) {
      pageload(currentHash = location.hash);
    }
  }, 200);

}
if ( document.readyState === "complete" ) {
  onReady();
} else if (document.addEventListener) {
  document.addEventListener('DOMContentLoaded', onReady, false);
  document.addEventListener('load', onReady, false);
} else if (document.attachEvent) {
  document.attachEvent('onreadystatechange', onReady);
  document.attachEvent('onload', onReady);
}