requestRunning = false;

function toggleSubMenu(e, id, mode) {
    if (mode == 'maxi') {
        // Agrandissement
        if ($('normal').getStyle('opacity') == 1) {
            // cache les icones
            $('maxi').getChildren('div').each(function(el) { el.setStyle('display', 'none'); });
            $('maxi-' + id).setStyle('display', 'block');

            // masque les normales et affiche les mini/maxi
            new Fx.Tween('normal', {
                duration: 250,
                onComplete: function (e) {
                    $('normal').setStyle('display', 'none');

                    $('minimaxi').setStyle('display', 'block');

                    // Positionne les miniatures
                    pos = [
                        { x: 50, y: 30 },
                        { x: 270, y: 160 },
                        { x: 100, y: 230 }
                    ];

                    i = 0;
                    $('mini').getElements('div').each(function(el) {
                        el.setStyle('display', 'block');

                        if (id == el.get('id').split('-')[1]) {
                            el.setStyle('display', 'none');
                        } else {
                            el.setStyles({
                                position: 'absolute',
                                left: $('mini').getCoordinates().left + pos[i].x,
                                top: $('mini').getCoordinates().top + pos[i].y
                            });

                            i++;
                        }
                    });

                    new Fx.Tween('minimaxi', {
                        duration: 250
                    }).start('opacity', 0, 1);
                }
            }).start('opacity', 1, 0);
        } else {
            // cache les icones
            $('maxi').getChildren('div').each(function(el) { el.setStyle('display', 'none'); });
            $('maxi-' + id).setStyle('display', 'block');

            // Positionne les miniatures
            pos = [
                { x: 50, y: 30 },
                { x: 270, y: 160 },
                { x: 100, y: 230 }
            ];

            i = 0;
            $('mini').getElements('div').each(function(el) {
                el.setStyle('display', 'block');

                if (id == el.get('id').split('-')[1]) {
                    el.setStyle('display', 'none');
                } else {
                    el.setStyles({
                        position: 'absolute',
                        left: $('mini').getCoordinates().left + pos[i].x,
                        top: $('mini').getCoordinates().top + pos[i].y
                    });

                    i++;
                }
            });
        }
    } else if (mode == 'mini') {
        if ($('minimaxi').getStyle('opacity') == 1) {
            new Fx.Tween('minimaxi', {
                duration: 250,
                onComplete: function (e) {
                    $('minimaxi').setStyle('display', 'none');

                    $('normal').setStyle('display', 'block');
                    new Fx.Tween('normal', {
                        duration: 250
                    }).start('opacity', 0, 1);
                }
            }).start('opacity', 1, 0);
        }
    }
}

window.addEvent('domready', function() {
    // centrage du site verticalement
    var winDim = window.getSize();
    var siteDim = $('website').getSize();

    if (winDim.y > siteDim.y) {
        $('website').setStyle('margin-top', (winDim.y - siteDim.y) / 2);
    }


    new Fx.Tween('sub-menu', {
        duration: 1500,
        onComplete: function() {
            $('normal').getElements('div').each(function(el) {
                el.addEvent('click', toggleSubMenu.bindWithEvent(this, [el.get('id').split('-')[1], 'maxi']));
            });
            $('mini').getElements('div').each(function(el) {
                el.addEvent('click', toggleSubMenu.bindWithEvent(this, [el.get('id').split('-')[1], 'maxi']));
            });
            $('minimaxi').addEvent('mouseleave', toggleSubMenu.bindWithEvent(this, [$('minimaxi').get('id').split('-')[1], 'mini']));
        }
    }).start('opacity', 0, 1);
});