/***********************************\
  *            yh.js v2.0             *
  *                                   *
  *    Infoboxes + shoutbox + blog    *
  *          for yorhel.nl            *
  *                                   *
  *    Copyright 2008 Yoran Heling    *
  *           info@yorhel.nl          *
  *                                   *
  *       License: Public Domain      *
  * Just use it for whatever you want *
  \***********************************/

var imgs = {
 jpg: 32,
 gif: 1,
 png: 1
};

function x(y){return document.getElementById(y)}
function DOMLoad(y){var d=0;var f=function(){if(d++)return;y()};
if(document.addEventListener)document.addEventListener("DOMCont"
+"entLoaded",f,false);document.write("<script id=_ie defer src="
+"javascript:void(0)><\/script>");document.getElementById('_ie')
.onreadystatechange=function(){if(this.readyState=="complete")f()
};if(/WebKit/i.test(navigator.userAgent))var t=setInterval(
function(){if(/loaded|complete/.test(document.readyState)){
clearInterval(t);f()}},10);window.onload=f;}



/*  A N I M A T E D   B O X E S  */

var boxSel = '';
var ao = false;
var scroll = 0;

function addBoxClick(par) {
  var i;
  var l = par.getElementsByTagName('a');
  for(i=0;i<l.length;i++) {
    if(l[i].href.indexOf('#nfo_') >= 0)
      l[i].onclick = showBox;
    if(l[i].href.indexOf('#scroll_') >= 0) {
      l[i].onmouseover = l[i].href.indexOf('#scroll_up') >= 0 ?
        function() { scroll =  1; setTimeout(doScroll, 30); } :
        function() { scroll = -1; setTimeout(doScroll, 30); };
      l[i].onmouseout = function() { scroll = 0; }
      l[i].onclick = function() {return false};
    }
  }
  document.forms[0].onsubmit = doShout;
}

function finishBox(hr) {
  var bdiv = x(hr).getElementsByTagName('div')[0];
  if(!x(hr+'_hid')) {
   // Add close-button
    bdiv.innerHTML = '<a href="#'+hr+'" class="hide" id="'+hr+'_hid">close</a>' + bdiv.innerHTML;
   // add up/down button
    if(bdiv.getElementsByTagName('div')[0]) {
      bdiv.innerHTML =
         '<a href="#scroll_down" class="scroll_down butt">v</a>'
        +'<a href="#scroll_up" class="scroll_up butt">^</a>'
        +bdiv.innerHTML;
      var i;
      var bl = bdiv.getElementsByTagName('div')[0];
      var l = bdiv.getElementsByTagName('a');
     // test whether we can scroll, and show/hide the appropriate buttons
      var prev = bl.scrollTop++;
      if(bl.scrollTop == prev) {
        for(i=0;i<l.length;i++) 
          if(l[i].href.indexOf('#scroll_down') >= 0)
            l[i].style.display = 'none';
        
      } else
        bl.scrollTop--;
      prev = bl.scrollTop--;
      if(bl.scrollTop == prev) {
        for(i=0;i<l.length;i++)
          if(l[i].href.indexOf('#scroll_up') >= 0)
            l[i].style.display = 'none';
      } else
        bl.scrollTop++;
    }
  }

  addBoxClick(bdiv);
}

function showBox(arg) {
  var hr;
  if(this && this.href)
    hr = this.href.substr(this.href.indexOf('#nfo_') + 1);
  else
    hr = arg;
  var box = x(hr);
  var load = false;
  if(!box) {
    document.getElementsByTagName('body')[0].innerHTML
      += '<div id="'+hr+'"><div>...loading...</div></div>';
    addBoxClick(document); // click events will get lost after modifying innerHTML
    box = x(hr);
    load = true;
  }

 // hide any existing boxes
  if(boxSel)
    hideBox(boxSel);
  if(boxSel == hr) {
    location.href = '#';
    boxSel = '';
    return false;
  }
  boxSel = hr;

 // start the animation  
  var i;var t = -400; 
  i = setInterval(function () {
    t += 25;
    box.style.top = t+'px';
    if(t >= 100) {
      clearInterval(i);
      i = setInterval(function () {
        t -= 5;
        box.style.top = t+'px';
        if(t <= 80)
          clearInterval(i);
      }, 25);
    }
  }, 25);

 // get/modify contents
  if(!load && hr != 'nfo_shout')
    finishBox(hr);
  else {
    var ao = (window.ActiveXObject) ? new ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest();
    ao.onreadystatechange = function () {
      if(ao.readyState == 4) {
        var bdiv = load ? x(hr).getElementsByTagName('div')[0] : x('shoutres');
        try {
          if(ao.status == 200)
            bdiv.innerHTML = ao.responseText
          else
            bdiv.innerHTML = 'Page not found...';
        } catch (e) {
          bdiv.innerHTML = 'ERROR!';
        }
        finishBox(hr);
      }
    };
    ao.open('GET', '/cms/'+hr.substr(4)+'.txt?r='+(Math.floor(Math.random()*999)+1), true);
    ao.send(null);
  }

  location.href = '#'+hr;
  return false;
}

function hideBox(hr) {
  var box = x(hr);
  if(!box)
    return false;
  var bdiv = box.getElementsByTagName('div')[0];
  var bcon = bdiv.innerHTML;
  bdiv.innerHTML = '';

  var i;var t=80;var h=300;
  i = setInterval(function () {
    t += 160/10;
    h -= 300/10;
    box.style.top = t+'px';
    bdiv.style.height = h+'px';
    if(h < 300/12) {
      clearInterval(i);
      box.style.top = '-400px';
      bdiv.style.height = '300px';
      setTimeout(function () { bdiv.innerHTML = bcon; }, 10);
    }
  }, 25);
}



/*  S C R O L L I N G  */

function doScroll() {
  if(scroll != 0) {
    setTimeout(doScroll, 30);
    var bl = x(boxSel).getElementsByTagName('div')[0].getElementsByTagName('div')[0];
    var i;
    var prev = bl.scrollTop;
    bl.scrollTop += (scroll < 0 ? 10 : -10);
    l = x(boxSel).getElementsByTagName('a');
    for(i=0;i<l.length;i++)
      if(l[i].className.indexOf('scroll_down') >= 0|| l[i].className.indexOf('scroll_up') >= 0)
        l[i].style.display =
          bl.scrollTop != prev ? 'block' :
          l[i].className.indexOf('scroll_down') >= 0 ? (scroll < 0 ? 'none' : 'block' ) :
                                                       (scroll > 0 ? 'none' : 'block' );
  }
}



/*  S H O U T B O X  */

function doShout() {
  var v = document.forms[0].getElementsByTagName('input')[0].value;
  var s = document.forms[0].getElementsByTagName('input')[1];
  s.value = 'loading';
  s.style.enabled = false;
  var ao = (window.ActiveXObject) ? new ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest();
  ao.onreadystatechange = function () {
    if(ao.readyState == 4) {
      try {
        if(ao.status == 200)
          x('shoutres').innerHTML = ao.responseText
        else
          x('shoutres').innerHTML = 'Page not found...';
      } catch (e) {
        x('shoutres').innerHTML = 'ERROR!';
      }
      finishBox('nfo_shout');
      s.style.enabled = true;
      s.value = 'Shout!';
    }
  };
  ao.open('GET', '/cms/shout.txt?shout='+encodeURIComponent(v), true);
  ao.send(null);
  return false;
}



/*  R A N D O M   I M A G E  */

function randImg() {
  var i;var x;var l = [];
  for(x in imgs)
    for(i=1;i<=imgs[x];i++)
      l[l.length]=i+'.'+x; 
  document.body.style.background = '#000 url(http://static.yorhel.nl/yh/'+
    l[Math.floor(Math.random()*l.length)]+') no-repeat fixed center center';
}



/*  O N L O A D  */

DOMLoad(function() {
  // HTML, wha?
  document.body.innerHTML =
    '<ul class="top">'
   +' <li><a href="#nfo_about">About //YorHel</a></li>'
   +' <li><a href="#nfo_links">Links</a></li>'
   +' <li><a href="#nfo_blatest">Blog</a></li>'
   +' <li><a href="#nfo_iaq">IAQ</a></li>'
   +' <li><a href="#nfo_shout">Shoutbox</a></li>'
   +'</ul>'
   +'<div id="nfo_shout"><div>'
   +' <h1>Confession box</h1>'
   +' <a href="#nfo_shout01" class="shout_prev butt">&#8592;</a>'
   +' <form method="get" action="/"><fieldset>'
   +'  <input type="text" name="shout" size="20" class="text" />'
   +'  <input type="submit" class="submit" value="Shout!"><br />'
   +' </fieldset></form>'
   +' <div id="shoutres">...loading...</div>'
   +'</div></div>';

  // random image...
  randImg();

  // add onclick events to #nfo_ and #scroll_ links
  addBoxClick(document);

  // open box
  if(location.hash && location.hash.indexOf('#nfo_') >= 0)
    showBox(location.hash.substr(location.hash.indexOf('#nfo_')+1));
});