// Home Slide Show (HSS) script

var HSS_SLIDING_INTERVAL = 5000 // interval between slidings, 5000 means 5 seconds
var HSS_SLIDINF_DURATION = 500  // sliding animation duration, 500 means 0.5 seconds
//
var HSS_ANIMATION_STEP_COUNT = 20; // sliding animation steps count
//
var HSS_IMAGE_WIDTH = 960;
var HSS_IMAGES_COUNT = 4;
//
var HSS_BTN_NORMAL = "#e3e3df"; // button normal background
//
var HSS_BTN_HOT = new Array();
HSS_BTN_HOT[0] = "#efd28c"; // 1st button hot background
HSS_BTN_HOT[1] = "#f38b05"; // 2nd button hot background
HSS_BTN_HOT[2] = "#11b5ce"; // 3rd button hot background
HSS_BTN_HOT[3] = "#71b12c"; // 4th button hot background
//
var hssImageIndex = 0; // current image index (0..3)
var hssContainer = null; // container DIV (the container DIV is inside main DIV)
//
var hssMainIntervalId = null;  // main (sliding) intervalId
var hssAnimationIntervalId = null; // animation (image moving) intervalId
//
var hssButtons = new Array(); // 4 buttons
//
var hssAnimationStep = 0; // animation current step
var hssAnimationFrom = 0; // animation "from" (starting) value
var hssAnimationTo = 0;   // animation "to" (ending) value

// ----- add initialization event handler: -----
if (window.addEventListener) {
    window.addEventListener("load", hssInitialize, false)
} else {
    window.attachEvent("onload", hssInitialize);
}

function hssInitialize() {
    if (hssContainer != null) return;
    //
    hssContainer = document.getElementById("hssDivSliding");
    //
    hssButtons[0] = document.getElementById("hssButtons0");
    hssButtons[1] = document.getElementById("hssButtons1");
    hssButtons[2] = document.getElementById("hssButtons2");
    hssButtons[3] = document.getElementById("hssButtons3");
    //
    hssLightButton(0);
    //
    hssStartSliding();
}

function hssStartSliding() {
    if (hssMainIntervalId == null) {
        hssMainIntervalId = window.setInterval(hssMainTick, HSS_SLIDING_INTERVAL);
    }
}

function hssStopSliding() {
    if (hssMainIntervalId != null) {
        window.clearInterval(hssMainIntervalId);
        hssMainIntervalId = null;
    }
}

function hssMainTick() {
    var newIndex = (hssImageIndex + 1) % HSS_IMAGES_COUNT;
    hssStartAnimation(hssImageIndex, newIndex);
    hssImageIndex = newIndex;
}

function hssStartAnimation(oldIndex, newIndex) {
    if (oldIndex == newIndex) return;
    //
    if (hssAnimationIntervalId != null) {
        hssStopAnimation();
    }
    //
    hssLightButton(newIndex);
    hssBlowOutButton(oldIndex);
    //
    hssAnimationFrom = -oldIndex * HSS_IMAGE_WIDTH;
    hssAnimationTo = -newIndex * HSS_IMAGE_WIDTH;
    hssAnimationStep = 1;
    //
    hssAnimationIntervalId = window.setInterval(hssAnimationTick, HSS_SLIDINF_DURATION / HSS_ANIMATION_STEP_COUNT);
}

function hssAnimationTick() {
    if (hssAnimationStep > HSS_ANIMATION_STEP_COUNT) {
        hssStopAnimation();
        return;
    }
    var left = hssAnimationFrom + ((hssAnimationTo - hssAnimationFrom) * hssAnimationStep) / HSS_ANIMATION_STEP_COUNT;
    hssContainer.style.left = left.toString() + "px";
    hssAnimationStep++;
}

function hssStopAnimation() {
    if (hssAnimationIntervalId != null) {
        window.clearInterval(hssAnimationIntervalId);
        hssAnimationIntervalId = null;
    }
}

function hssMainDivMouseOver() {
    hssStopSliding();
}

function hssMainDivMouseOut() {
    hssStartSliding();
}

function hssButtonClick(index) {
    hssStopAnimation();
    //
    hssStartAnimation(hssImageIndex, index);
    hssImageIndex = index;
}

function hssLightButton(btnIndex) {
    hssButtons[btnIndex].style.background = HSS_BTN_HOT[btnIndex];
}

function hssBlowOutButton(btnIndex) {
    hssButtons[btnIndex].style.background = HSS_BTN_NORMAL;
}

function hssButtonMouseOver(index) {
    hssLightButton(index);
}

function hssButtonMouseOut(index) {
    if (index != hssImageIndex) {
        hssBlowOutButton(index);
    }
}