/**
  * E-mark
  * Tim Dirckx
  * Editable: Plus.jpg and min.jpg images and The tekst for the lightbox download now
  * the rest of the styles for the theme is editable in the theme.css
  */

window.addEvent('domready', function(){    
    if($('mediaContent')) {
        $('mediaContent').load('84743D715D3141939B26CC5B5FA6DB7A.htm');
        
        $$('#mediaMenu > .mediaBtn > a').each(function(e, key) 
        {
            e.addEvent('click', function(f) 
            {
                f.stop();
            
                $('mediaContent').set('load', 
                {
                    onComplete: function() 
                    {
                        loadGallery();
                        loadSlider();
                    }
                }).load(e.get('href') + "?time=" + $time());
            });
            
            e.addEvent('mouseover', function(f) 
            {
                clsName = '.mediaPreview' + key
                $$(clsName).setStyle('display', 'block');
                image = $$(clsName).getElement('img');
                if(image[0] !== null) {
                    var size = image.getSize();
                    $$(clsName).setStyles({
                        'height': (size[0].y + 15) + 'px',
                        'margin-top': '-' + (size[0].y + 15) + 'px'
                    });
                }
            });
            
            e.addEvent('mouseout', function() 
            {
                clsName = '.mediaPreview' + key
                $$(clsName).setStyle('display', 'none');
            });
        });
    }    
    
    if($('cityMenu')) {
        $$('#cityMenu > a').each(function(k, key) {
            if(!key) {
                $('cityContent').load(k.get('href') + "?time=" + $time());
                k.addClass('selected');
            }            
            k.addEvent('click', function(f) {
                f.stop();
                $$('#cityMenu a').removeClass('selected');
                $('cityContent').load(k.get('href') + "?time=" + $time());
                k.addClass('selected');
            });
        });   
    }
    
    function loadSlider() {
        if($('mediaSlider')) {
            var count="";
            $$('#mediaSliderSlider > a').each(function(e, key) {
                count = key;
                
                e.addEvent('click', function(f) {    
                    f.stop();
                    $('mediaSliderContent').load(e.get('href') + "?time=" + $time());
                });
            });
            
            
            count <= 5 ? $('right').removeClass('hoverEffct').addClass('disabledBtn'): '';
            
            $('right').addEvent('click', function(e) {
                e.stop();
                var leftPos = $('mediaSliderSlider').getStyle('left').toInt();
                var mover = new Fx.Morph($('mediaSliderSlider'), { duration: 'long', transition: Fx.Transitions.Expo.easeOut });
                
                widthWrapLeft = 0 - (count * 100);
                widthWrapLeftMax = 0 - (count * 100)+500;
                leftPos = (Math.round(leftPos / 100)*100);
                
                //check if next position is bigger then the width and smaller then the max left position
                if(leftPos - 600 > widthWrapLeft && leftPos - 600 <= widthWrapLeftMax) {
                    mover.start({
                        'left': [ leftPos,widthWrapLeftMax ]
                    });
                    $('right').removeClass('hoverEffct').addClass('disabledBtn');
                    
                //if this is not the case so the left position is still bigger then then max left position
                } else if ( leftPos - 600 > widthWrapLeft ) {
                    mover.start({
                        'left': [ leftPos, leftPos - 500 ]
                    });
                } 
                count > 5 ?    $('left').addClass('hoverEffct').removeClass('disabledBtn') : '';
            });
            
            $('left').addEvent('click', function(e) {
                e.stop();
                var leftPos = $('mediaSliderSlider').getStyle('left').toInt();
                var mover = new Fx.Morph($('mediaSliderSlider'), {duration: 'long', transition: Fx.Transitions.Expo.easeOut});
                leftPos = Math.round(leftPos / 100)*100;
                if ( leftPos + 600 <= 0 && leftPos + 1200 <=0 ) {
                    mover.start({
                        'left': [ leftPos, leftPos + 600 ]
                    });
                } else if ( leftPos <= 1 ) {
                    mover.start({
                        'left': [ leftPos, 0 ]
                    });
                    $('left').removeClass('hoverEffct').addClass('disabledBtn');
                }
                
                count > 5 ?    $('right').addClass('hoverEffct').removeClass('disabledBtn'): '';
            });
        }
    }    
    
    //create our Accordion instance
    var myAccordion = new Fx.Accordion($('faw'), 'h2.toggler', 'div.faqContent', {
        opacity: true,
        onActive: function(toggler, element){
            toggler.getElement('img').set("src", "min.jpg");
        },
        onBackground: function(toggler, element){
            toggler.getElement('img').set("src", "plus.jpg");
        }
    });
    if($('whenAndWhere')) {
        $$('.when').setStyle('display', 'none');
        
        $('whereMenu').addEvent('click', function(e) {
            e.stop();
            $$('.where').setStyle('display', 'inline');
            $$('.when').setStyle('display', 'none');
            $('whereMenu').addClass('enabledBtn').removeClass('disabledBtn');
            $('whenMenu').addClass('disabledBtn').removeClass('enabledBtn');
        });
        
        $('whenMenu').addEvent('click', function(e) {
            e.stop();
            $$('.where').setStyle('display', 'none');
            $$('.when').setStyle('display', 'inline');
            $('whereMenu').addClass('disabledBtn').removeClass('enabledBtn');
            $('whenMenu').addClass('enabledBtn').removeClass('disabledBtn');
        });
    }
    
    if($('whenAndWhereContent')) {
        $$('#whenAndWhereContent .when > div.dateAndPlaceWrap').each(function(e, key) {
            e.addEvent('mouseenter', function(f) {
                e.addClass('whenAndWhere-background-wrap').removeClass('bottomLine'); 
                $$('#whenAndWhereContent .when .dateAndPlaceWrap:nth-child(0n+'+(key+1)+')').addClass('removeBackground').removeClass('bottomLine'); 
            });
            e.addEvent('mouseleave', function(f) {
                e.removeClass('whenAndWhere-background-wrap').addClass('bottomLine'); 
                $$('#whenAndWhereContent .when .dateAndPlaceWrap:nth-child(0n+'+(key+1)+')').addClass('bottomLine').removeClass('removeBackground');
            });
        });
    }
    
    if($('mainMenu')) {
        $$('#mainMenu > ul li').each(function(e, key) {
            e.addEvent('mouseover', function(f) {
                e.getElement('a').getElement('span').addClass('hover2');
            });
            e.addEvent('mouseout', function(f) {
                e.getElement('a').getElement('span').removeClass('hover2');
            });
        });
    }
    
    if($('listCitys')) {
        $$('#listCitys > .citys .citysInfo .citysDate a').each(function(e) {
            e.addEvent('mouseover', function(f) {
                e.getParent('.citysDate').getParent('.citysInfo').getParent('.citys').addClass('bgCitys');
            });
            e.addEvent('mouseleave', function(f) {
                e.getParent('.citysDate').getParent('.citysInfo').getParent('.citys').removeClass('bgCitys');
            });
        });
    }
});
function loadGallery() {
    if($('mediaGallery')) {
        var lightImg = new Hash();
        var lightImgAlt = new Hash();
        $$('#mediaGallery > img').each(function(e, key) {
            lightImg.set(key, e.get('rel'));
            lightImgAlt.set(key, e.get('alt'));
            countImages = key;
        });
            
        $$('#mediaGallery > img').each(function(e, key) 
        {        
            e.addEvent('click', function(s) {
                var page = key;
                var l = new Lightbox({
                onShow: function () 
                {                
                    var lightboxImg = $('lightbox-image');
                    var lightboxBtn = $('lightbox-buttons');
                
                    l.overlay.addEvent('click', function() 
                    {
                        l.hide();
                    });
                    
                    document.addEvent('keydown', function(event) 
                    {
                        if(event.key == "esc") {
                            l.hide();
                        }
                    });
                    
                    var left = new Element('a', {
                        'href': '#',
                        'id': 'left',
                        'html': 'PREVIOUS',
                        'events': {
                            'click': function() {                                        
                                if(page != 0) {
                                    page = page - 1
                                } 
                                getPages(page, countImages);
                                loadImageInLightbox($('lightbox-image'), lightImg.get(page), lightImgAlt.get(page));
                            }
                        }
                    });
                    
                    document.addEvent('keydown', function(event) {
                        if (event.key == "left") {
                            if(page != 0) {
                                page = page - 1
                            } 
                            getPages(page, countImages);
                            loadImageInLightbox($('lightbox-image'), lightImg.get(page), lightImgAlt.get(page));
                        } else if (event.key == "right") {
                            if(page <= 10) {
                                page = page + 1
                            } 
                            getPages(page, countImages);
                            loadImageInLightbox($('lightbox-image'), lightImg.get(page), lightImgAlt.get(page));
                        }
                        
                    })
                
                    var right = new Element('a', {
                        'href': '#',
                        'id': 'right',
                        'html': 'NEXT',
                        'events': {
                            'click': function() {
                                if(page <= 10) {
                                    page = page + 1
                                } 
                                getPages(page, countImages);
                                loadImageInLightbox($('lightbox-image'), lightImg.get(page), lightImgAlt.get(page));
                            }
                        }
                    });
                    
                    
                    var lightboxImage = new Element('div', {
                        'id': 'lightbox-image'
                    });
                    
                    var lightboxButtons = new Element('div', {
                        'id': 'lightbox-buttons'
                    });                            
                    
                    lightboxImage.inject(l.body, 'top')
                    loadImageInLightbox($('lightbox-image'), e.get('rel'), e.get('alt'));
                    lightboxButtons.inject(l.body, 'bottom')
                    getPages(page, countImages);
                    left.inject($('lightbox-buttons'), 'top');
                    right.inject($('lightbox-buttons'), 'bottom');
                    new Element('div').inject($('lightbox-buttons'), 'bottom').addClass('clear');
                    $$('.lightbox-close-wrapper a').set('html', 'download this Image');
                },
                onClose: function() {
                    document.removeEvents('keydown');
                }
                }).show();
            });
        });
    }
}
function getPages(page, countImages) {
    if($('lightbox-pages')) {
        $('lightbox-pages').set('html', 'IMAGE ' + (page + 1) + '/'  + (countImages+1));
    } else {
        var lightboxPages = new Element('span', {
            'id': 'lightbox-pages',
            'html': 'IMAGE ' + (page + 1) + '/' + (countImages+1)
        });
        lightboxPages.inject($('lightbox-buttons'), 'top');
    }
}
function loadImageInLightbox(body, theImage, alt) {
    if($('loader-wrap')) {
        $('loader-wrap').destroy();
    }
    var myLoader = new Element('img', {
        'src': 'ajax-loader.gif',
        'alt': '',
        'id': 'loader'
    });
    
    var myLoaderWrap = new Element('div', {
        'id': 'loader-wrap'
    });
    
    myLoader.inject(myLoaderWrap).setStyles({
        "left":"50%",
        "position":"absolute",
        "top":"50%",
        "width":"20px",
        "z-index":"2000"
    });
    
    var bodyWidth = $('lightbox-image').getSize().x;
    if($('lightbox-image').getSize().y === 0) {
        var bodyHeight = 60;
    } else {
        var bodyHeight = $('lightbox-image').getSize().y - 4;
    }
        
    myLoaderWrap.inject(body, 'bottom').setStyles({
        "background-color":"black",
        "position":"absolute",
        "top":45,
        "left":51,
        "width": bodyWidth + "px",
        "height": bodyHeight + "px",
        "z-index":"1999",
        "opacity": "0"
        
    }).morph({opacity: 0.5});
    
    var setImg = new Element('img', {
        'src': theImage,
        'alt': alt
    });
    
    var newImg = new Asset.images(theImage, {
        onComplete: function() {
            myLoaderWrap.morph({opacity: 0, duration: 'short'});
            $$('.lightbox-close-wrapper span').set('html', alt);
            $$('.lightbox-close-wrapper a').set('href', 'link.asp?img=' + theImage);
            body.set('html', '');
            setImg.inject(body);
            $$('.lightbox-content').setStyles({
                'margin': "0 0 0 -" + ((parseInt(newImg.get('width'))+102) / 2) + "px",
                'width': (parseInt(newImg.get('width'))+102) + "px"
            });
        }
    });
}