var sls4AutoStart = true;                    // start animation (true = yes, false = no)
var sls4PauseTime = 15;                       // change pages every .. seconds
var sls4Mode = "slide";                      // mode can be "slide" or "fade"
var sls4ViewModeIcons = false;                // view mode icons (true = yes, false = no)
var sls4FadeSpeed = 15;                      // fading speed (just for fade mode)

var sls4Width = 168;                         // content width (pixels)
var sls4Height = 92;                        // content height (pixels)
var sls4Color = "#ffffff";                   // content background color
var sls4Overflow = "hidden";                 // content scrollbars: "auto" or "hidden"
                                            // ("auto" may cause flickering with Gecko browsers)

var sls4BorderWidth = 0;                     // border width (pixels)
var sls4BorderStyle = "solid";               // border style (CSS-spec, e.g. "solid", "outset", "inset", etc.)
var sls4BorderColor = "#f1f1f1";             // border color

var sls4BarHeight = 10;                      // iconbar height (pixels)
var sls4BarSpace = 0;                        // space between iconbar and slideshow (pixels)
var sls4BarPosition = "bottom";              // iconbar position ("top" or "bottom")

var sls4ImgPrev = "js/previous.gif";            // previous button: path to image
var sls4ImgPrevWidth = 10;                   // previous button: image width (pixels)
var sls4ImgNext = "js/next.gif";                // next button: path to image
var sls4ImgNextWidth = 10;                   // next button: image width (pixels)
var sls4ImgPlay = "js/play.gif";                // play button: path to image
var sls4ImgPlayWidth = 10;                   // play button: image width (pixels)
var sls4ImgStop = "js/stop.gif";                // stop button: path to image
var sls4ImgStopWidth = 10;                   // stop button: image width (pixels)
var sls4ImgSlide = "js/slide.gif";              // slide mode button: path to image
var sls4ImgSlideWidth = 13;                  // slide mode button: image width (pixels)
var sls4ImgFade = "js/fade.gif";                // fade mode button: path to image
var sls4ImgFadeWidth = 13;                   // fade mode button: image width (pixels)
var sls4ImgBlank = "js/blank.gif";              // path to blank image

var sls4IndView = true;                      // view index (true = yes, false = no)
var sls4IndCount = 5;                       // max. number of visible index entries
var sls4IndSpace = 2;                        // space between index and iconbar
var sls4IndColor = "";                       // index background color
var sls4IndFont = "Arial"; 				       // index font family
var sls4IndFontSize = 11;                    // index font size (pixels)
var sls4IndPosition = "bottom";              // index position ("top" or "bottom")

//---------------------------------------------------------------------------------------------------------
// Functions
//---------------------------------------------------------------------------------------------------------

var DOM = document.getElementById;
var OP = (window.opera || navigator.userAgent.indexOf('Opera') != -1);
var IE4 = (document.all && !OP);

var sls4Bord, sls4Cont, sls4Area, sls4BarArea, sls4IndArea, sls4IV, sls4Timer, sls4Previous;
var sls4IndStart = sls4CurPage = 0;
var sls4Pages = (typeof(sls4Contents) != 'undefined') ? sls4Contents.length : 0;
var sls4Animation = false;

var sls4W = sls4Width;
var sls4H = sls4Height + sls4BarSpace + sls4BarHeight;
if(sls4IndView) sls4H += sls4IndSpace + sls4IndFontSize;

function sls4Object(id) {
  this.elem = DOM ? document.getElementById(id) : document.all[id];
  this.css = this.elem.style;
  this.width = this.elem.offsetWidth;
  this.left = this.elem.offsetLeft;
  return this;
}

function sls4SetMode(type) {
  type = type.toLowerCase();

  if(type == 'slide') {
    if(document.images.sls4Fade) {
      document.images.sls4Fade.style.backgroundColor = '#666666';
    }
    if(document.images.sls4Slide) {
      document.images.sls4Slide.style.backgroundColor = '#FF0000';
    }
  }
  else if(type == 'fade') {
    if(document.images.sls4Slide) {
      document.images.sls4Slide.style.backgroundColor = '#666666';
    }
    if(document.images.sls4Fade) {
      document.images.sls4Fade.style.backgroundColor = '#FF0000';
    }
  }
  else {
    alert('Wrong type: ' + type);
    return false;
  }
  sls4Previous = null;
  sls4Mode = type;
  sls4Jump(sls4CurPage);
  if(sls4PauseTime && sls4AutoStart) sls4StartAnimation();
}

function sls4PrevPage() {
  if(!sls4Animation && sls4CurPage > 0) {
    sls4Jump(sls4CurPage - 1);
  }
}

function sls4NextPage() {
  if(!sls4Animation && sls4CurPage < sls4Pages - 1) {
    sls4Jump(sls4CurPage + 1);
  }
}

function sls4Jump(page) {
  if(!sls4Animation) {
    var newPage = new sls4Object('sls4Page' + page);

    if(page != sls4CurPage) {
      sls4Previous = new sls4Object('sls4Page' + sls4CurPage);
      sls4Previous.css.zIndex = 1;

      if(sls4Mode == 'fade') {
        newPage.css.left = '0px';
        sls4Opacity = 0;
        sls4SetOpacity(newPage);
        newPage.css.display = 'block';
        newPage.css.zIndex = 2;
        sls4IV = setInterval('sls4Fader(' + page + ')', 1);
      }
      else {
        var offset = (page > sls4CurPage) ? sls4Width : -sls4Width;
        newPage.css.left = offset + 'px';
        newPage.css.display = 'block';
        newPage.css.zIndex = 2;
        sls4IV = setInterval('sls4Slider(' + page + ', ' + sls4CurPage + ')', 1);
      }
      sls4CurPage = page;
    }
    else newPage.css.display = 'block';
  }
}

function sls4CheckImg() {
  var iconbar = 0;
  var img = document.images['sls4Left'];
  if(sls4CurPage <= 0) img.src = sls4ImgBlank;
  else img.src = iconbar = sls4ImgPrev;
  img = document.images['sls4Right'];
  if(sls4CurPage >= sls4Pages - 1) img.src = sls4ImgBlank;
  else img.src = iconbar = sls4ImgNext;
  if(!iconbar) sls4BarArea.css.visibility = sls4IndArea.css.visibility = 'hidden';
}

function sls4GetIndStart() {
  var start = 0;
  if(sls4CurPage % sls4IndCount == 0) {
    start = sls4CurPage + 1;
  }
  else if(sls4CurPage % sls4IndCount == sls4IndCount - 1) {
    start = sls4CurPage - sls4IndCount + 2;
  }
  return start;
}

function sls4SetIndex(start) {
  if(!sls4Animation) {
    if(start) sls4IndStart = start - 1;
    var html = link = '';
    for(var i = sls4IndStart; i < sls4Pages && i < sls4IndStart + sls4IndCount; i++) {
      if(i && html) html += ' ';
      if(i == sls4CurPage) html += '<b>' + (i+1) + '</b>';
      else {
        link = 'javascript:sls4StopAnimation(); sls4Jump(' + i + ')';
        html += '<a href="' + link + '" style="text-decoration:none">' + (i+1) + '</a>';
      }
    }
    if(sls4IndStart) {
      link = 'javascript:sls4SetIndex(' + (sls4IndStart - sls4IndCount+1) + ')';
      html += ' <a href="' + link + '" style="text-decoration:none">&lt;&lt;</a> ';
    }
    if(i < sls4Pages) {
      link = 'javascript:sls4SetIndex(' + (i+1) + ')';
      html += ' <a href="' + link + '" style="text-decoration:none">&gt;&gt;</a>';
    }
    sls4IndArea.elem.innerHTML = html;
  }
}

function sls4DoAnimation() {
  if(sls4CurPage >= sls4Pages - 1) sls4Jump(0);
  else sls4NextPage();
}

function sls4StopAnimation() {
  if(sls4AutoStart) {
    if(sls4Timer) clearInterval(sls4Timer);
    var img = document.images['sls4PlayStop'];
    img.src = sls4ImgPlay;
    img.width = sls4ImgPlayWidth;
    img.onclick = function() { sls4StartAnimation(true); this.blur(); }
    sls4AutoStart = false;
  }
}

function sls4StartAnimation(showNext) {
  sls4StopAnimation();
  sls4Timer = setInterval('sls4DoAnimation()', sls4PauseTime * 1000);
  var img = document.images['sls4PlayStop'];
  img.src = sls4ImgStop;
  img.width = sls4ImgStopWidth;
  img.onclick = function() { sls4StopAnimation(); this.blur(); }
  sls4AutoStart = true;
  if(showNext) sls4DoAnimation();
}

function sls4Init() {
  if(DOM || IE4) {
    if(!sls4Pages) {
      alert("No contents found.");
      return false;
    }
    sls4Bord = new sls4Object('sls4Border');
    sls4Cont = new sls4Object('sls4Container');
    sls4Area = new sls4Object('sls4Slider');
    sls4BarArea = new sls4Object('sls4Bar');
    if(sls4IndView) sls4IndArea = new sls4Object('sls4Ind');

    if(sls4Color) sls4Cont.css.backgroundColor = sls4Color;
    if(sls4IndColor) sls4IndArea.css.backgroundColor = sls4IndColor;

    var bordTop = 0;
    if(sls4BarPosition == 'top') bordTop += (sls4BarHeight + sls4BarSpace);
    if(sls4IndView && sls4IndPosition == 'top') bordTop += (sls4IndFontSize + sls4IndSpace);

    sls4Bord.css.top = bordTop + 'px';
    sls4Bord.css.width = sls4Width + 'px';
    sls4Bord.css.height = sls4Height + 'px';

    sls4Area.width = sls4Width;
    sls4Area.css.width = sls4Area.width + 'px';
    sls4Area.css.position = 'absolute';

    sls4Cont.css.width = sls4Width + 'px';
    sls4Cont.css.height = sls4Height + 'px';
    sls4Cont.css.visibility = 'visible';

    var content = '<img src="' + sls4ImgPrev + '" name="sls4Left" height="' + sls4BarHeight + '"' +
                  ' width="' + sls4ImgPrevWidth + '" style="margin:0px 5px; cursor:pointer"' +
                  ' onClick="sls4StopAnimation(); sls4PrevPage(); this.blur()">' +
                  '<img src="' + sls4ImgPlay + '" name="sls4PlayStop" height="' + sls4BarHeight + '"' +
                  ' width="' + sls4ImgPlayWidth + '" style="margin:0px 5px; cursor:pointer"' +
                  ' onClick="sls4StartAnimation(true); this.blur()">' +
                  '<img src="' + sls4ImgNext + '" name="sls4Right" height="' + sls4BarHeight + '"' +
                  ' width="' + sls4ImgNextWidth + '" style="margin:0px 5px; cursor:pointer"' +
                  ' onClick="sls4StopAnimation(); sls4NextPage(); this.blur()">';

    if(sls4ViewModeIcons) {
      content += '<img src="' + sls4ImgSlide + '" name="sls4Slide" height="' + sls4BarHeight + '"' +
                 ' width="' + sls4ImgSlideWidth + '" style="margin:0px 5px 0px 25px; cursor:pointer"' +
                 ' onClick="sls4SetMode(\'slide\')">' +
                 '<img src="' + sls4ImgFade + '" name="sls4Fade" height="' + sls4BarHeight + '"' +
                 ' width="' + sls4ImgFadeWidth + '" style="margin:0px 5px; cursor:pointer"' +
                 ' onClick="sls4SetMode(\'fade\')">';
    }
    var barTop = 0;
    if(sls4BarPosition != 'top') barTop += sls4Height + sls4BarSpace;
    if(sls4IndView && sls4IndPosition == 'top') barTop += sls4IndFontSize + sls4IndSpace;
    sls4BarArea.elem.innerHTML = content;
    sls4BarArea.css.top = barTop + 'px';
    sls4BarArea.css.width = sls4W + 'px';
    sls4BarArea.css.height = sls4BarHeight + 'px';
    sls4BarArea.css.textAlign = 'center';

    if(sls4IndView) {
      var indTop = (sls4IndPosition == 'top') ? 0 : sls4Height + sls4BarSpace + sls4BarHeight + sls4IndSpace;
      sls4IndArea.css.top = indTop + 'px';
      sls4IndArea.css.height = sls4IndFontSize + 'px';
      sls4IndArea.css.width = sls4W + 'px';
      sls4IndArea.css.textAlign = 'center';
      if(sls4IndFont) sls4IndArea.css.fontFamily = sls4IndFont;
      if(sls4IndFontSize) sls4IndArea.css.fontSize = sls4IndFontSize + 'px';
      sls4SetIndex();
    }
    var obj;

    for(var i = 0; i < sls4Pages; i++) {
      obj = new sls4Object('sls4Page' + i);
      obj.css.position = 'absolute';
      obj.css.display = 'none';
      obj.css.zIndex = 1;
    }
    setTimeout('sls4CheckImg()', 100);
    sls4SetMode(sls4Mode);
  }
  else alert("Sorry, this script doesn't work with your browser.");
}

//---------------------------------------------------------------------------------------------------------
// Page slider
//---------------------------------------------------------------------------------------------------------

function sls4Slider(nextPage, prevPage) {
  var nextObj = new sls4Object('sls4Page' + nextPage);
  var prevObj = new sls4Object('sls4Page' + prevPage);

  if(prevObj && nextObj && nextObj.left != 0) {
    sls4Animation = true;
    var pixel = 0.1 * nextObj.left;
    if(pixel > 0) pixel = Math.ceil(pixel);
    else pixel = Math.floor(pixel);
    prevObj.css.left = (prevObj.left - pixel) + 'px';
    nextObj.css.left = (nextObj.left - pixel) + 'px';
  }
  else {
    sls4Animation = false;
    if(sls4IV) clearInterval(sls4IV);
    sls4CheckImg();
    if(sls4IndView) sls4SetIndex(sls4GetIndStart());
  }
}

//---------------------------------------------------------------------------------------------------------
// Page fader
//---------------------------------------------------------------------------------------------------------

var sls4Opacity = 0;

function sls4SetOpacity(obj) {
  if(obj) {
    obj.css.opacity = sls4Opacity / 100;
    obj.css.MozOpacity = sls4Opacity / 100;
    obj.css.KhtmlOpacity = sls4Opacity / 100;
    obj.css.filter = 'alpha(opacity=' + sls4Opacity + ')';
  }
}

function sls4Fader(page) {
  if(obj = new sls4Object('sls4Page' + page)) {
    sls4Animation = true;
    if(sls4FadeSpeed && sls4Opacity < 100) {
      sls4Opacity += sls4FadeSpeed;
      if(sls4Opacity > 100) sls4Opacity = 100;
      sls4SetOpacity(obj);
    }
    else {
      sls4Animation = false;
      sls4Opacity = 0;
      if(sls4IV) clearInterval(sls4IV);
      sls4CheckImg();
      if(sls4IndView) sls4SetIndex(sls4GetIndStart());
      if(sls4Previous && sls4Previous != obj) {
        sls4Previous.css.display = 'none';
      }
    }
  }
}

//---------------------------------------------------------------------------------------------------------
// Create slideshow
//---------------------------------------------------------------------------------------------------------

function sls4BuildContainers() {
  document.write('<div id="slideShow4" style="position:relative; width:' + sls4W + 'px; height:' + sls4H + 'px">');
  if(sls4IndView) document.write('<div id="sls4Ind" style="position:absolute; z-index:69"></div>');
  document.write('<div id="sls4Bar" style="position:absolute; z-index:69"></div>');
  document.write('<div id="sls4Border" style="position:absolute">');
  document.write('<div id="sls4Container" style="position:absolute; z-index:0; overflow:hidden;');
  document.write(' clip:rect(0,' + sls4Width + ',' + sls4Height + ',0); visibility:hidden">');
  document.write('<div id="sls4Slider">');

  for(var i = 0; i < sls4Pages; i++) {
    document.write('<div id="sls4Page' + i + '" style="width:' + sls4Width + 'px;');
    document.write(' height:' + sls4Height + 'px; overflow:' + sls4Overflow + '; background-color:' + sls4Color + '">');
    document.write(sls4Contents[i] + '</div>');
  }
  document.write('</div></div></div></div>');
}

sls4BuildContainers();
window.onload = sls4Init;