function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  }
  else {
    window.onload = function() {
      oldonload();
      func();
    }
  }
}

function moveSlideshow(elementID,final_x,final_y,interval) {
  if (!document.getElementById(elementID)) return false;
  var elem = document.getElementById(elementID);

  if (elem.movement) {
    clearTimeout(elem.movement);
  }

  var xpos = parseInt(elem.style.left);
  var ypos = parseInt(elem.style.top);
  if (xpos == final_x && ypos == final_y) {
    return true;
  }

  if (final_x <= -elem.max_x) {
    final_x = -elem.max_x;
  }
  if (final_x > 0) {
    final_x = 0;
  }
  if (xpos < final_x) {
    var dist = Math.ceil((final_x - xpos)/10);
    xpos = xpos + dist;
  }
  if (xpos > final_x) {
    var dist = Math.ceil((xpos - final_x)/10);
    xpos = xpos - dist;
  }
  if (xpos <= -elem.max_x) {
    xpos = -elem.max_x;
  }
  if (xpos > 0) {
    xpos = 0;
  }

  elem.style.left = xpos + "px";
  elem.style.top = ypos + "px";
  var repeat = "moveSlideshow('"+elementID+"',"+final_x+","+final_y+","+interval+")";
  elem.movement = setTimeout(repeat,interval);
}

function prepareSlideshow() {
  if (!document.getElementsByTagName) return false;
  if (!document.getElementById) return false;
  if (!document.getElementById("slideshow")) return false;

  var slideshow = document.getElementById("slideshow");
  var wrapper = document.getElementById("slideshow_wrapper");
  var slideshow_set = document.getElementById("slideshow_set");

  var imgli = slideshow_set.getElementsByTagName("li");
  var liw = imgli[0].offsetWidth;
  var wrapw = wrapper.offsetWidth;
  var width = imgli.length * liw;
  var imgli_sel = 0;
  var imgleft = 0;

  for (var i=0; i<imgli.length; i++) {
    imgli[i].style.width = liw + "px";
    if (imgli[i].className == "sel") imgli_sel = i*liw;
  }

  var imgc = Math.floor(wrapw/liw);
  imgc = (imgc < imgli.length)?imgc : imgli.length;

  var ww = imgc*liw;
  var wp = 25 + ((wrapw-ww)/2);
  wrapper.style.width = ww + "px";
  wrapper.style.left = wp + "px";

  slideshow_set.max_x = (imgli.length-imgc) * liw;
  slideshow_set.max_y = imgli.length * liw;
  
  slideshow_set.style.width = width + "px";
  if (imgli_sel>(ww-liw)) {
    imgleft = -(imgli_sel-(ww-liw));
  }
  slideshow_set.style.left = imgleft+"px";
  slideshow_set.style.top = 0+"px";
  slideshow_set.style.visibility = "visible";

  var navigation = document.createElement("ul");
  navigation.setAttribute("id", "navigation");
  //  left
    var li = document.createElement("li");
    var scroll_left = document.createElement("a");
    scroll_left.setAttribute("id", "scroll_left");
    scroll_left.href ="#";
    li.appendChild(scroll_left);
    navigation.appendChild(li);
    slideshow.insertBefore(navigation, wrapper);
  //  right
    var li = document.createElement("li");
    var scroll_right = document.createElement("a");
    scroll_right.setAttribute("id", "scroll_right");
    scroll_right.href ="#";
    li.appendChild(scroll_right);
    navigation.appendChild(li);
    slideshow.insertBefore(navigation, wrapper);

  if (imgleft < 0) {
    scroll_left.style.background = "url(/images/left.gif)";
    scroll_left.style.cursor = "pointer";
  }
  else if (imgleft == 0 && imgc < imgli.length) {
    scroll_left.style.background = "url(/images/left_cb.gif)";
  }  
  if (imgc < imgli.length && imgleft > -slideshow_set.max_x) {
    scroll_right.style.background = "url(/images/right.gif)";
    scroll_right.style.cursor = "pointer";
  }
  else if (imgc < imgli.length && imgleft == -slideshow_set.max_x) {
    scroll_right.style.background = "url(/images/right_cb.gif)";
  }
  
  if (imgc < imgli.length) {
   // Attach event for left
   scroll_left.onclick = function() {
    var scroll_left = document.getElementById("scroll_left");
    var scroll_right = document.getElementById("scroll_right");
    var slideshow_set = document.getElementById("slideshow_set");
    var x = parseInt(slideshow_set.style.left);
    if (x % liw == 0) {
      moveSlideshow("slideshow_set",x+liw,0,10);
    }
    if (x < -liw) {
      scroll_left.style.background = "url(/images/left.gif)";
      scroll_left.style.cursor = "pointer";
    }
    else {
      scroll_left.style.background = "url(/images/left_cb.gif)";
      scroll_left.style.cursor = "default";
    }
    y = -(liw*(imgli.length-imgc));
    if (x >= y && imgc < imgli.length) {
      scroll_right.style.background = "url(/images/right.gif)";
      scroll_right.style.cursor = "pointer";
    }
    else {
      scroll_right.style.background = "url(/images/right_cb.gif)";
      scroll_right.style.cursor = "default";
    }
    return false;
   }
   // Attach event for right
   scroll_right.onclick = function() {
    var scroll_left = document.getElementById("scroll_left");
    var scroll_right = document.getElementById("scroll_right");
    var slideshow_set = document.getElementById("slideshow_set");
    var x = parseInt(slideshow_set.style.left);
    if (x % liw == 0) {
      moveSlideshow("slideshow_set",x-liw,0,10);
    }
    if (x < 1 && imgc < imgli.length) {
      scroll_left.style.background = "url(/images/left.gif)";
      scroll_left.style.cursor = "pointer";
    }
    else {
      scroll_left.style.background = "url(/images/left_cb.gif)";
      scroll_left.style.cursor = "default";
    }
    y = 1-(liw*(imgli.length-imgc-1));
    if (x < y) {
      scroll_right.style.background = "url(/images/right_cb.gif)";
      scroll_right.style.cursor = "default";
    }
    else {
      scroll_right.style.background = "url(/images/right.gif)";
      scroll_right.style.cursor = "pointer";
    }
    return false;
   }
  }
}

addLoadEvent(prepareSlideshow);