document.documentElement.className += " js";

var Slider = new Class({
    Implements: Options,
    element : null,
    timer : null,
    options: {
        timeoutMilliseconds : 1000
    },
    initialize: function(element, options){
        this.element = element;
        if(options){
            this.setOptions(options);
        }
        this.element.setStyles({
            'opacity': 0,
            'display': 'block'
        });
    },
    show_slider : function(){
        $clear(this.timer);
        this.element.tween('opacity', 1);
    },
    hide_slider : function(){
        var e = this.element;
        this.timer = (function(){
            e.tween('opacity', 0)
        }).delay(this.options.timeoutMilliseconds);
    },
    hide_slider_now : function(){
        var e = this.element;
        e.tween('opacity', 0);
    }
});

var NavSlider = new Class({
    Implements: Options,
    element : null,
    initialize: function(element, className){
        this.element = element;
        this.className = className;
    },
    show_slider : function(width){
        var e = this.element;
        e.tween('width', width);
    },
    hide_slider : function(width){
        var e = this.element;
        e.tween('width', width);
    },
    show_image : function(opacity){
        var c = this.className;
        c.tween('opacity', opacity);
    },
    hide_image : function(opacity){
        var c = this.className;
        c.tween('opacity', opacity);
    }
});

window.addEvent('resize', function(){
    if ($('meta')) {
        var currentHeightMeta = $('meta').getStyle('height');
        $('meta').setStyle('margin-top', (currentHeightMeta.toInt() / 2) * -1);
		
        if (document.body.clientHeight > 865) {
            $$('body').removeClass('imgsize495');
            $$('body').removeClass('imgsize360');
            $$('body').addClass('imgsize650');
        } else if (document.body.clientHeight > 700) {
            $$('body').removeClass('imgsize650');
            $$('body').removeClass('imgsize360');
            $$('body').addClass('imgsize495');
        } else {
            $$('body').removeClass('imgsize495');
            $$('body').removeClass('imgsize495');
            $$('body').addClass('imgsize360');
        }
    }
});

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

    // searchform focus on domready
    if ($('ctrl_filter_search')) {
        $('ctrl_filter_search').focus();
    }
	
    if ($('left')) {
        var currentWidth = $('left').getStyle('width');
        var maxWidth = 280;
		
        var currentHeight = $('left').getStyle('height');
        $('left').setStyle('margin-top', ((currentHeight.toInt() / 2) * -1) + 25);
    }
	
    if ($('meta')) {
        var currentHeightMeta = $('meta').getStyle('height');
        $('meta').setStyle('margin-top', (currentHeightMeta.toInt() / 2) * -1);
		
        if (document.body.clientHeight > 865) {
            $$('body').addClass('imgsize650');
        } else if (document.body.clientHeight > 700) {
            $$('body').addClass('imgsize495');
        } else{
            $$('body').addClass('imgsize360');
        }
		
    }

    // langswitch slider on hover
    if ($('langswitch')) {
        var menu = null;
		
        menu = new Slider($('langswitch'));
        $$('#langicon, #langswitch').addEvents({
            mouseenter: function(event) {
                menu.show_slider();
            },
            mouseleave: function() {
                menu.hide_slider_now();
            }
        });
    }

    // navigation slider on hover
    // only on detail pages
    if ($$('body.detail') && $$('body.detail').length > 0) {
        var navDetail = null;
        var opacity = 1, toOpacity = 0.1;
		
        navDetail = new NavSlider($('left'), $$('body.detail #main img'));
        $('left').addEvents({
            mouseenter: function(event) {
                navDetail.show_slider(maxWidth);
                navDetail.show_image(toOpacity);
            },
            mouseleave: function() {
                navDetail.hide_slider(currentWidth);
                navDetail.hide_image(opacity);
            }
        });
    }

    // navigation slider on hover
    // only on general pages
    if ($$('body.pages') && $$('body.pages').length > 0) {
        var navPages = null;
        var opacity = 1, toOpacity = 0.4;
		
        navPages = new NavSlider($('left'), $$('body.pages #main'));
        $('left').addEvents({
            mouseenter: function(event) {
                navPages.show_slider(maxWidth);
                navPages.show_image(toOpacity);
            //$(this).getElements('a').setStyle('display','block');
            },
            mouseleave: function() {
                navPages.hide_slider(currentWidth);
                navPages.hide_image(opacity);
            //$(this).getElements('a').setStyle('display','none');
            }
        });
    }
	
    // spinning animation on detail page
    if ($('spin')) {
        if ($('dreams')) {

            $('spin').addEvent('click', function(){
                var imageContainer = $('productimage').getElement('div.image_container');
                var firstImage = imageContainer.getFirst('a');
                firstImage.inject(imageContainer);
                $each($('productimage').getElement('.image_container').getElements('a'), function(href,index){
                    if (index == 0){
                        href.setStyle('float','left');
                    }else{
                        href.setStyle('float','right');
                    }
                });
            });
			
        } else {
		
            $('backview').setStyle('opacity', 0);
			
            var toggleImage = function(hide, show) {
                hide.tween('opacity', 0).setStyle('display', 'none');
                show.setStyle('display', 'block').tween('opacity', 1);
            };
			
            $('spin').addEvent('click', function(){
                if ($('frontview').getStyle('display') == 'block') {
                    var hide = $('frontview'), show = $('backview');
                    toggleImage(hide, show);
                } else {
                    var hide = $('backview'), show = $('frontview');
                    toggleImage(hide, show);
                }
            });
			
        }
    }
	
    // center pagination
    if ($$('div.pagination') && $$('div.pagination').length > 0 && $$('body')[0].hasClass('ie7') == false) {

        var paginationWidth = $$('div.pagination')[0].getStyle('width').toInt();
        var liWidth = 0;
        $each($$('div.pagination li'), function(item){
            liWidth += item.getStyle('width').toInt() + 10;
        // +10 margin-right. Den letzen margin Right unten bitte wieder abziehen!
        });
        $$('div.pagination')[0].setStyle('padding-left', ((paginationWidth - 10 - liWidth)/2) - 7);
    } 

});