function moveSlideshow(elementID,final_x,final_y,interval) {
    if (!document.getElementById) return false;
    
    // if the element does not exist we have nothing to do
    if (!document.getElementById(elementID)) return false;
    var elem = document.getElementById(elementID);
    
    // the slideshow events stack up and the animation is not smooth anymore
    if (elem.movement) {
        clearTimeout(elem.movement);
    }
    
    // current slideshow position
    var xpos = parseInt(elem.style.left);
    var ypos = parseInt(elem.style.top);
    if (xpos == final_x && ypos == final_y) {
        return true;
    }
    
    // restrict moving to white area
    if (final_x <= -max_set_x) {
        final_x = -max_set_x;
    }
    if (final_x > 0) {
	    final_x = 0;
    }
    
    // animation bit (taken from the book DOM Scripting by Jeremy Keith)
    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;
    }
  
    // again, restrict showing white area
    if (xpos <= -max_set_x) {
	    xpos = -max_set_x;
    }
    if (xpos > 0) {
	    xpos = 0;
    }
    
    // fix the elements position
    elem.style.left = xpos + "px";
    elem.style.top = ypos + "px";
    
    // and set up the event again after an interval
    var repeat = "moveSlideshow('"+elementID+"',"+final_x+","+final_y+","+interval+")";
    elem.movement = setTimeout(repeat,interval);
}

var max_set_x

function prepareSlideshow() {
    // need the width of the gallery so that they do not scroll vertical
	var set_width = $("#slideshow_set > li").length * 194;
	max_set_x = set_width - 388;
    
    // set css and append navigation
    var nav = '<ul id="navigation"><li><a id="scroll_left" href="#">Left</a></li><li><a id="scroll_right" href="#">Right</a></li></ul>';
    $("#slideshow").css({ width: "430px", height: "140px" }).prepend(nav);
	$("#slideshow").addClass('advanced');
    $("#slideshow_wrapper").css({ width: "388px", height: "130px", overflow: "hidden" });
    $("#slideshow_set").css({ position: "absolute", top: "0px", left: "0px" }).css("width", set_width);
    
	// append click functions
    $("a#scroll_left").click(function () {
        // get the current position of the gallery element
		var x = parseInt($("#slideshow_set").css("left"));
		if (x % 194 == 0) {
    		moveSlideshow("slideshow_set",x+194,0,10);
		}
		return false;
    });
    $("a#scroll_right").click(function () {
        // get the current position of the gallery element
		var x = parseInt($("#slideshow_set").css("left"));
		if (x % 194 == 0) {
    		moveSlideshow("slideshow_set",x-194,0,10);
		}
		return false;
    });
}

$(document).ready(function(){
    prepareSlideshow();
});