// gallery dynamic effects

// slideshow parameters
var thumbCount;
var currentThumb = 1;
var thumbInterval = 5;
var animator;

// show an image popup
function showPopup(e)
{
    $('vervolg').setStyle({overflow: 'hidden', display: 'block'});
    var elm = Event.element(e);
    elm = elm.up('a');
    currentThumb = parseInt(elm.name);
    var popup = 'big' + elm.name;
    $('cover').show();
    $('container').scrollTo();
    var scroll = $('container').cumulativeScrollOffset().top;
    $('cover').setStyle({top: scroll + 'px'});
    $('popupcontainer').show();
    $('popupcontainer').setStyle({paddingTop: scroll + 'px'});
    $(popup).show();
    Element.setStyle(popup, {opacity: 1});
}

// hide image popup
function hidePopup(e)
{
    if (animator)
        animator.stop();
    var elm = Event.element(e);
    elm = elm.up('.popup');
    elm.hide();
    Element.setStyle(elm, {opacity: 0});
    $('cover').hide();
    $('popupcontainer').hide();
    $('vervolg').setStyle({overflow: '', display: ''});
}

// show next image popup
function nextPopup(e)
{
    if (animator) {
        animator.stop();
        animator = new PeriodicalExecuter(swapPopups, thumbInterval);
    }
    var elm = Event.element(e);
    elm = elm.up('.popup');
    elm.hide();
    Element.setStyle(elm, {opacity: 0});
    currentThumb += 1;
    if (currentThumb > thumbCount)
        currentThumb = 1;
    var popup = 'big' + currentThumb;
    $(popup).show();
    Element.setStyle(popup, {opacity: 1});
}

// show previous image popup
function prevPopup(e)
{
    if (animator) {
        animator.stop();
        animator = new PeriodicalExecuter(swapPopups, thumbInterval);
    }
    var elm = Event.element(e);
    elm = elm.up('.popup');
    elm.hide();
    Element.setStyle(elm, {opacity: 0});
    currentThumb -= 1;
    if (currentThumb < 1)
        currentThumb = thumbCount;
    var popup = 'big' + currentThumb;
    $(popup).show();
    Element.setStyle(popup, {opacity: 1});
}

// start slideshow
function startSlides(e)
{
    if (!animator)
        animator = new PeriodicalExecuter(swapPopups, thumbInterval);
}

// slide next popup
function swapPopups()
{
    var popup = 'big' + currentThumb;
    $(popup).hide();
    Element.setStyle(popup, {opacity: 0});
    currentThumb += 1;
    if (currentThumb > thumbCount)
        currentThumb = 1;
    var popup = 'big' + currentThumb;
    $(popup).show();
    Element.setStyle(popup, {opacity: 1});
}

// switch the current swatch
function switchSwatch(e)
{
    var elm = Event.element(e);
    elm = elm.up('a');
    var txt = elm.down('img').getAttribute('alt');
    var background = 'bigimage' + elm.name;
    $$('.bigimg').each(function(b) {b.hide()});
    $(background).show();
    $('description').update(txt);
}

// initialise page
function init()
{
    // count popups at start
    thumbCount = $$('.popup').length;
    $$('.swatch').each(function(s)
    {
        Event.observe(s, 'click', showPopup);
    });
    $$('.close').each(function(b)
    {
        Event.observe(b, 'click', hidePopup);
    });
    $$('.close').each(function(b)
    {
        Event.observe(b, 'click', hidePopup);
    });
    $$('.next').each(function(b)
    {
        Event.observe(b, 'click', nextPopup);
    });
    $$('.prev').each(function(b)
    {
        Event.observe(b, 'click', prevPopup);
    });
    $$('.slide').each(function(b)
    {
        Event.observe(b, 'click', startSlides);
    });

    $$('.sample').each(function(s)
    {
        Event.observe(s, 'click', switchSwatch); // hehehe
    });
}

Event.observe(window, 'load', init);

