var slideShow = {

    init: function()
    {
        $('content').getElements('img.slide_show').each(function(elem){
            slideShow.create(elem);
        });
    },


    create: function(elem)
    {
        var addSlideShower = function()
        {
            var buttons = '';
            var leftButton = '';
            var rightButton = '';
            var title = elem.get('alt').split(/\s*\[|\/|\]\s*/);
            var coordinates = elem.getCoordinates();
            //var countImages = elem.get('alt').match(/\d{1,3}\/\d{1,3}/g)[0].split(/\s*\[|\/|\]\s*/);

            if (Browser.ie && !title[2]) {title[2] = title[1]; title[1] = title[0]; title[0] = ''; } // ie

            if (title[1] == 1) leftButton = '<a href="#" class="left_passive" onClick="return false;"></a>'; else leftButton = '<a href="#" class="left" onClick="return false;"></a>';
            if (title[1] == title[2]) rightButton = '<a href="#" class="right_passive" onClick="return false;"></a>'; else rightButton = '<a href="#" class="right" onClick="return false;"></a>';
            if (title[2] > 1) buttons = rightButton +'<div class="middle"></div>'+ leftButton;

            if (title[2] != 1 || title[0] != '')
            {
                var inner = '<table><tr><td height="80%"></td></tr><tr><td height="20%"><span><i>'+ title[0] +'</i></span>'+ buttons +'</td></tr></table>';
                var slide_shower = new Element(
                    'div',
                    {
                        'styles':
                        {
                            'position': 'absolute',
                            'background-color': 'transparent',
                            'top': coordinates['top'],
                            'left': coordinates['left'],
                            'width': coordinates['width'],
                            'height': coordinates['height'],
                            'z-index': '3',
                            'opacity': '0.3'
                        },
                        'class': 'slide_shower'
                    }
                ).set('html', inner).inject(document.body, 'top');

                slide_shower.fade(1);
                slide_shower.addEvent('mouseleave', function(){ slideShow.destroy(slide_shower); });
                if (slide_shower.getElement('a.left'))  slide_shower.getElement('a.left').addEvent('click', function(){ slideShow.load(elem, 'prv'); });
                if (slide_shower.getElement('a.right')) slide_shower.getElement('a.right').addEvent('click', function(){ slideShow.load(elem, 'next'); });
            }
        };

        elem.addEvent('mouseover', addSlideShower);
    },


    load: function(elem, what)
    {
        elem.removeEvents('mouseover');
        var id = elem.get('src').match(/\d{1,4}/)[0].toInt();

        new Request.JSON({
            url: '/ajax.php?do=slide',
            onComplete: function(response) {
                if (response)
                {
                    //$$('div.slide_shower')[0].destroy();
                    slideShow.destroy($$('div.slide_shower')[0]);

                    var myImages = new Asset.images(response.src, {
                        onComplete: function(){
                            elem.set('src', response.src);
                            elem.set('alt', response.alt);
                            slideShow.create(elem);
                        }
                    });


                }
        }}).get({ 'id': id, 'what': what });
    },


    destroy: function(elem)
    {
        var destroy = function(){ elem.destroy(); };
        elem.fade(0);
        destroy.delay(200);
    }

};