var currentScroll = 0;

function ajax(url,target) {
  try {
    req = new XMLHttpRequest();
  } catch(error) {
    try {
      req = new ActiveXObject("Microsoft.XMLHTTP");
    } catch(error) {
      req = null;
    }
  }
  req.onreadystatechange = function() {ajaxDone(target);};
  req.open("GET", url, true);
  req.send(null);
}

function ajaxDone(target) {
  if (req.readyState < 4 ) {
      document.getElementById(target).innerHTML = '<img src="/images/ajax-loader.gif" alt="Loading..." />';
  } else if (req.readyState == 4) {
    if (req.status == 200 || req.status == 304) {
      results = req.responseText;
      document.getElementById(target).innerHTML = results;
    } else {
      document.getElementById(target).innerHTML="ajax error:\n" +
      req.statusText;
    }
  }
}

function roll(px, direction, ele, height) {
  var element = document.getElementById(ele);
  var scrollTo = currentScroll;
  var j = 0;
  if(direction == 'up') {
    if(currentScroll == 0) {
      scrollTo = -height+px;
      for(var i = currentScroll; i >= scrollTo; i--) {
        setTimeout("document.getElementById('"+ele+"').style.marginTop = '"+i+"px'", j);
        j++;
      }
    } else {
      scrollTo += px;
      for(var i = currentScroll; i <= scrollTo; i++) {
        setTimeout("document.getElementById('"+ele+"').style.marginTop = '"+i+"px'", j);
        j++;
      }
    }
    currentScroll = scrollTo;
    return true;
  } else if(direction == 'down') {
    if(currentScroll == -(height-px)) {
      scrollTo = 0;
      for(var i = currentScroll; i <= scrollTo; i++) {
        setTimeout("document.getElementById('"+ele+"').style.marginTop = '"+i+"px'", j);
        j++;
      }
    } else {
      scrollTo -= px;
      for(var i = currentScroll; i >= scrollTo; i--) {
        setTimeout("document.getElementById('"+ele+"').style.marginTop = '"+i+"px'", j);
        j++;
      }
    }
    currentScroll = scrollTo;
    return true;
  } else
    return false;
}