Event.observe(window, 'load', init);
var sliderVisible = null;
var sliders = new Hash();
sliders.set('trigger1', 'slider1');
sliders.set('trigger2', 'slider2');
sliders.set('trigger3', 'slider3');
sliders.set('trigger4', 'slider4');
sliders.set('trigger5', 'slider5');

function init(event) {
    multiObserve('.slide_trigger', 'click', slideTrigger);
    if ($('slider1') != undefined) slide($('slider1'));
    Effect.Pulsate('guideLabel', { pulses: 4, duration: 3 });
}

function slideTrigger(event) {
    var triggerElement = event.element();
    var slider = $(sliders.get(triggerElement.identify()));
    if (slider != sliderVisible)
        slide(slider);
    return false;
}

function slide(element) {
    var sliderToHide = sliderVisible;
    sliderVisible = element;
    var effectsList = new Array();
    effectsList.push(Effect.BlindShow(sliderVisible, { sync: true }));
    if (sliderToHide != null) {
        Effect.Fade($(sliderToHide.identify() + '_child'), { duration: 0.1, queue: { position: 'end', scope: 'sliderscope' } });
        effectsList.push(Effect.BlindHide(sliderToHide, { sync: true }));
    }
    new Effect.Parallel(effectsList, { duration: 1.0, queue: { position: 'end', scope: 'sliderscope' } });
    Effect.Appear($(sliderVisible.identify() + '_child'), { duration: 0.25, queue: { position: 'end', scope: 'sliderscope' } });
}

Effect.BlindHide = function(element) {
  element = $(element);
  element.makeClipping();
  return new Effect.Scale(element, 0,
    Object.extend({ scaleContent: false,
      scaleY: false,
      restoreAfterFinish: true,
      afterFinishInternal: function(effect) {
        effect.element.hide().undoClipping();
      }
    }, arguments[1] || { })
  );
};

Effect.BlindShow = function(element) {
  element = $(element);
  var elementDimensions = element.getDimensions();
  return new Effect.Scale(element, 100, Object.extend({
    scaleContent: false,
    scaleY: false,
    scaleFrom: 0,
    scaleMode: {originalHeight: elementDimensions.height, originalWidth: elementDimensions.width},
    restoreAfterFinish: true,
    afterSetup: function(effect) {
      effect.element.makeClipping().setStyle({width: '0px'}).show();
    },
    afterFinishInternal: function(effect) {
      effect.element.undoClipping();
    }
  }, arguments[1] || { }));
};

function multiObserve(cssSelector, event, target) {
    // assign events to ge checkboxes
    var items = $$(cssSelector);
    for (var i=0; i<items.length; i++)
        items[i].observe(event, target);
}
