function Slider(containerId, slideId, framecount, framewidth) {
    this.containerId = containerId;

    this.slideId = slideId;

    this.frameCount = framecount;
    this.frameWidth = framewidth;
    this.stripeSize = this.frameCount * this.frameWidth;

    this.x = 0;

    this.currentFrame = 0;
    this.targetFrame = 0;
    this.targetX = 0;

    this.SlideStepBase = 16;
    this.SlideDelay = 30;

    this.SlideStep = 0;

    this.SlideWaitTime = 10000;

    this.SlideTimer = undefined;
    this.SlideWaitTimer = undefined;

    this.IsSliding = false;

    this.offsetLeft = 0;
}

Slider.prototype.Move = function(px) {
    if (px < 0)
        px += this.stripeSize;
    if (px >= this.stripeSize)
        px -= this.stripeSize;

    var z = document.getElementById(this.slideId);
    z.style.marginLeft = -px + 'px';
}


Slider.prototype.Stop = function() {
    this.IsSliding = false;

    this.currentFrame = this.targetFrame;

    if (this.currentFrame < 0)
        this.currentFrame += this.frameCount;
    if (this.currentFrame >= this.frameCount)
        this.currentFrame -= this.frameCount;

    this.x = this.currentFrame * this.frameWidth - this.offsetLeft;

    this.Move(this.x);

    var p = this;
    this.SlideWaitTimer = setTimeout(function() { p.SlideLeft(); }, this.SlideWaitTime);
}

Slider.prototype.Shift = function() {
    this.x += this.SlideStep;

    if (this.SlideStep > 0) {
        if (this.x >= this.targetX)
            this.Stop();
    }
    else {
        if (this.x <= this.targetX)
            this.Stop();
    }

    if (this.IsSliding) {
        var p = this;
        this.SlideTimer = setTimeout(function() { p.Shift(); }, this.SlideDelay);
    }

    this.Move(this.x);
}

Slider.prototype.StartShift = function() {

    clearTimeout(this.SlideTimer);
    clearTimeout(this.SlideWaitTimer);


    this.UpdateOffset();
    this.targetX = this.targetFrame * this.frameWidth - this.offsetLeft;

    this.SlideStep = this.SlideStepBase;
    if (this.targetFrame < this.currentFrame)
        this.SlideStep = -this.SlideStep;


    this.Shift();
}

Slider.prototype.Slide = function(step) {
    this.targetFrame = this.currentFrame + step;

    this.IsSliding = true;
    this.StartShift();
}

Slider.prototype.SlideLeft = function() {
    this.Slide(-1);
    return false;
}

Slider.prototype.SlideRight = function() {
    this.Slide(1);
    return false;
}

Slider.prototype.MoveInstant = function(frameIndex) {
    this.UpdateOffset();
    this.targetFrame = frameIndex;
    this.Stop();
    return false;
}

Slider.prototype.UpdateOffset = function() {
    var c = document.getElementById(this.containerId);
    var containerWidth = c.offsetWidth - c.offsetLeft;
    var pageContentWidth = 1100;
    if (containerWidth <= pageContentWidth)
        this.offsetLeft = 0;
    else
        this.offsetLeft = (containerWidth - pageContentWidth) / 2;
}