window.addEvent('domready', function() {

    if (!window.XMLHttpRequest) {
        return;
    }
    else { // ok to continue

        //-vertical
        $$('.drinksbox').each(function(el) {
            var myVerticalSlide = new Fx.Slide(el);
            el.slider = myVerticalSlide;
            myVerticalSlide.hide();
            $(el.id + '_c').addEvent('click', function(e) {
                e.stop();
                if (myVerticalSlide.open) {
                    $(el.id + '_c').addClass('arrowopen');
                    $(el.id + '_c').removeClass('arrowclose');
                } else {
                    $(el.id + '_c').addClass('arrowclose');
                    $(el.id + '_c').removeClass('arrowopen');
                }
                myVerticalSlide.toggle();
            });

            $('showall').addEvent('click', function(e) {
                e.stop();

                $$('.drinksbox').each(function(el) {
                    el.slider.show();
                });

                $$('.clickable').each(function(el) {
                    el.addClass('arrowclose');
                    el.removeClass('arrowopen');
                });

            });

            $('hideall').addEvent('click', function(e) {
                e.stop();

                $$('.drinksbox').each(function(el) {
                    el.slider.hide();
                });

                $$('.clickable').each(function(el) {
                    el.addClass('arrowopen');
                    el.removeClass('arrowclose');
                });

            });

        });

    }
    
});