window.addEvent('domready', function () {
    var closed = false;
    $('close_content').addEvent('click', function () {

        if (!closed) {
            $('content_main').set('morph', { duration: 2000, onComplete: function () { $('slideout').set('class', ''); } });
            $('content_main').setStyle('overflow', 'hidden');
            $('content_main').morph({ height: 0 });
            closed = true;
        }
        else {
            $('content_main').set('morph', { duration: 2000, onComplete: function () { $('slideout').set('class', 'close'); $('content_main').setStyle('overflow', 'auto'); } });
            $('content_main').morph({ height: 472 });
            closed = false;
        }
    });

    var totIncrement = 0;
    var increment = 102;
    var ct = $$('#change_image ul')[0];
    var numElementi = ct.getChildren().length;
    var maxRightIncrement = increment * (-(numElementi - 8));
    ct.set('morph', { duration: 1000, onComplete: function () { } });
    $('arrow_left').setStyle('display', 'none');
    if (numElementi <= 8) {
        $('arrow_right').setStyle('display', 'none');
    }

    $('arrow_left').addEvents({
        'click': function (event) {
            if (totIncrement < 0) {
                totIncrement = totIncrement + increment;
                ct.morph({ 'margin-left': totIncrement });
                if (totIncrement >= 0) {
                    $('arrow_left').setStyle('display', 'none');
                }
                $('arrow_right').setStyle('display', 'block');
            }
            else {
                $('arrow_left').setStyle('display', 'none');
                $('arrow_right').setStyle('display', 'block');
            }
        }
    });

    $('arrow_right').addEvents({
        'click': function (event) {
            if (totIncrement > maxRightIncrement) {
                totIncrement = totIncrement - increment;
                ct.morph({ 'margin-left': totIncrement });
                if (totIncrement <= maxRightIncrement) {
                    $('arrow_right').setStyle('display', 'none');
                }
                $('arrow_left').setStyle('display', 'block');
            }
        }
    });

});