﻿var Promo = {
    initialize: function() {
        Promo.__items = [];
        Promo.__index = -1;
    },
    initializeDOM: function() {
        Promo.__anchor = $$("#promo>.anchor")[0];
        Promo.__image = $$("#promo .image")[0];
        Promo.__swatch = $$("#promo>.swatch")[0];
        Promo.__initSwatch();
        Promo.__startTimer();
        Promo.moveFirst(false);        
    },
    add: function(source, url, title) {
        Promo.__items[Promo.__items.length] = {
            source: source,
            title: title,
            url: url
        }
    },
    __initSwatch: function() {
        if (Promo.__anchor) {
            var items = Promo.__swatch.select("a");
            if (Promo.__items.length <= 1) {
                Promo.__swatch.style.display = "none";
            }
            else {
                for (var i = 0; i < items.length; i++) {
                    if (i > 0 && i < items.length - 1 && i > Promo.__items.length) {
                        items[i].parentNode.style.display = "none";
                    }
                    if (i == 1) {
                        Promo.__switch(0, true);
                    }
                    if (i == 0) items[i].href = "javascript:Promo.movePrevious();";
                    else if (i == items.length - 1) items[i].href = "javascript:Promo.moveNext();";
                    else items[i].href = "javascript:Promo.moveTo(" + (i - 1) + ");";
                }
            }
        }
    },
    __change: function() {
        var item = Promo.__items[Promo.__index];
        Promo.__locked = false;
        if (item) {
            Promo.__image.src = "/images/blank.gif";
            Promo.__image.alt = "";
            Promo.__anchor.href = "";

            Promo.__image.src = item.source;
            Promo.__image.alt = item.title;
            Promo.__anchor.href = item.url;
        }
    },
    __stopTimer: function() {
        clearTimeout(Promo.__timer);
        Promo.__timer = null;
    },
    __startTimer: function() {
        if (!Promo.__timer)
            Promo.__timer = setTimeout("Promo.moveNext(true);", 7000);
    },
    __switch: function(index, auto) {
        if ((Promo.__index != index) && !Promo.__locked && Promo.__anchor) {
            Promo.__stopTimer();
            Promo.__locked = true;
            var items = Promo.__swatch.select("li");
            items[Promo.__index + 1].removeClassName("selected");
            items[index + 1].addClassName("selected");
            Promo.__index = index;
            if (Promo.__anchor) {
                if (auto) {
                    new Effect.Opacity(Promo.__anchor, { from: 1.0, to: 0.0, duration: 0.5, queue: { position: "end", scope: "promotion" }, afterFinish: Promo.__change });
                    new Effect.Opacity(Promo.__anchor, { from: 0.0, to: 1.0, duration: 0.5, queue: { position: "end", scope: "promotion" }, afterFinish: Promo.__startTimer });
                } else {
                    new Effect.Opacity(Promo.__anchor, { from: 1.0, to: 0.0, duration: 0.2, queue: { position: "end", scope: "promotion" }, afterFinish: Promo.__change });
                    new Effect.Opacity(Promo.__anchor, { from: 0.0, to: 1.0, duration: 0.2, queue: { position: "end", scope: "promotion" }, afterFinish: Promo.__startTimer });
                }
            } else Promo.__change();
        }
    },
    moveTo: function(index) {
        if (Promo.__index != index && index >= 0 && index < Promo.__items.length) Promo.__switch(index, false);
    },
    moveNext: function(auto) {
        if (Promo.__index < Promo.__items.length - 1) Promo.__switch(Promo.__index + 1, auto);
        else Promo.moveFirst(auto);
    },
    moveFirst: function(auto) { Promo.__switch(0, auto); },
    movePrevious: function() {
        if (Promo.__index > 0) Promo.__switch(Promo.__index - 1, false);
        else Promo.moveLast();
    },
    moveLast: function() { Promo.__switch(Promo.__items.length - 1, false); }
}

Promo.initialize();

document.observe("dom:loaded", function() {
    Promo.add("images/mainbanner/webshop-mainbanner.png", "/index.php/sites-n-shops/webshop.html", "Het complete e-commerce pakket, klaar voor gebruik in minuten.");
    Promo.add("images/mainbanner/hosting-mainbanner.png", "/index.php/hosting.html", "Het complete hosting pakket!");
    Promo.add("images/mainbanner/identiteit-mainbanner.png", "/index.php/advertising/complete-identiteit.html", "Het complete identiteit pakket voor MKB!.");
    Promo.initializeDOM();
});

