// JavaScript Document ess.js
// Author Marko Stutz
// global and default effect functions

if(typeof debugmod == 'undefined'){
    var debugmod = false;
}

var moduls = [];

var ess = {};

ess.ac = {};

ess.Base = new Class({
    Implements: Options,
    options: {
        shopBaseUrl   : '',
        blLoadArticle : false,
        blLoadZoomBox : false,
        blShowBasketMsg: false,
        blShowTopArticle: false
    },
    autoId: 0,
    blNewBasketItem: false,
    initialize: function(options){
        this.setOptions(options);
        this.baseUrl = this.options.shopBaseUrl;
        this.imageUrl = this.baseUrl+'out/oxbaseshop/html/0/images/';
        this.autoId = 0;
        this.artState = {
            title: ['', 'Versandfertig innerhalb 3-5 Werktagen.', 'Lieferzeit auf Anfrage.', 'Nicht mehr lieferbar.', 'Versandfertig innerhalb 24/48 Stunden.'],
            image: ['', 'status_orange.gif', 'status_orange_red.gif', 'status_red.gif', 'status_green.gif']
        };
        this.objects = {oSlideBox: null,oZoomBox: null,oMsgBox: null, instanceMsgToBasket: null, oHelpBoxSearch: null, aVariants: []};
        window.addEvent('domready', this.domready.bindWithEvent(this));
    },
    domready: function(){
        
        this.objects.oSlideBox = new ess.Effects.oSlideBox();
        
        if(this.options.blLoadArticle){
            $('page').getElements('[effect="variant"]').each(function(el,index){
                this.objects.aVariants[index] = new ess.Article.Variant(el.get('id'));
            }.bind(this));
        }
        if(this.options.blLoadZoomBox) this.objects.oZoomBox = new ess.Effects.MultiBox('mb', {descClassName: 'multiBoxDesc', useOverlay: true});
        if(this.options.blShowBasketMsg){
            this.objects.oMsgBox = new ess.Effects.MultiBox('msgb', {descClassName: 'multiBoxDesc', useOverlay: true, showControlButtons: false, contentBackgroundColor: '#333333'});
            this.objects.oMsgBox.open($('msgb1'));
        }
        if(this.options.blShowTopArticle) this.initTopArticle();
        this.objects.oHelpBoxSearch = new ess.Effects.MultiBox('mbinfo', {descClassName: 'multiBoxDesc', useOverlay: true, showControlButtons: true, contentBackgroundColor: '#FFFFFF'});
        
        if(debugmod){
            $('jsid_5').innerHTML += oAllTime.getResult();
            $('jsid_4').innerHTML += '<br>Browser: '+Browser.Engine.name;
            $('jsid_4').innerHTML += '<br>Modul: Base'+moduls.join('');
        }
    },
    startZoomImage: function(index){
        if(this.options.blLoadZoomBox){
            this.objects.oZoomBox.open($('zoom'+index));
        }
    },
    getNewId: function(blNum) {
        this.autoId += 1;
        if(blNum) return this.autoId;
        return 'essid'+this.autoId;
    },
    getArtState: function(state){
        if(isNaN(state) || state > 4 || state < 0 ) state = 0;
        return {title: this.artState.title[state], image: this.artState.image[state]}
    },
    toggleClass: function(id, classNames) {
        var aClasses = classNames ? classNames.split(',') : [];
        if ($(id) && aClasses.length > 1) {
            index = $(id).getProperty('classindex');
            if(index === null){
                $(id).setProperty('classindex',0);
                index = 0;
                if(!$(id).hasClass(aClasses[index])){
                    $(id).addClass(aClasses[index]);
                }
            }else{
                index = Number(index);
                if(aClasses.length > index+1){
                    $(id).removeClass(aClasses[index]);
                    $(id).addClass(aClasses[index+1]);
                    $(id).setProperty('classindex',index+1);
                }else{
                    $(id).removeClass(aClasses[index]);
                    $(id).addClass(aClasses[0]);
                    $(id).setProperty('classindex',0);
                }
            }
        }
    },
    checkLongdesc: function(newWidth){
        newWidth = isNaN(newWidth) ? 550 : newWidth*1;
        if ($('p_longdesc')){
            var elements = $('p_longdesc').getElements('[width]');
            if(elements){
                elements.each(function(el){
                    var x = el.getProperty('width');
                    if(x){
                        x = x.replace(/\W+/,"");
                        if(!isNaN(x) && (x*1) > newWidth) el.width = newWidth+'px';
                    }
                });
            }
        }
    },
    showMsgToBasket: function(form){
        $(form).submit();
        /*if(!this.objects.oMsgBox){
            this.objects.oMsgBox = new ess.Effects.MultiBox('msgb', {descClassName: 'multiBoxDesc', useOverlay: true, contentBackgroundColor: '#FFFFFF'});
        }
        this.objects.oMsgBox.options.contentBackgroundColor = '#FFFFFF';
        this.objects.oMsgBox.open($('msgb2'));
        if(form){
            window.setTimeout(function(){$(form).submit();},1100);
        }*/
    },
    showInfoBox: function(oBox,id){
        if(oBox && id){
            oBox.open($(id));
        }
    },
    initTopArticle: function(){
        var myAccordion = new Accordion($('accordion'), 'h3.toggler', 'div.element', {
            opacity: false,
            onActive: function(toggler, element){
                toggler.setStyle('color', '#41464D');
            },
            onBackground: function(toggler, element){
                toggler.setStyle('color', '#528CE0');
            }
        }); 
    }
});

var essBase = null;

ess.Element = {
    hide: function(element) {
        element = $(element);
        element.style.display = 'none';
        return element;
    },
    show: function(element) {
        element = $(element);
        element.style.display = 'block';
        return element;
    },
    visible_hide: function(element) {
        element = $(element);
        element.style.visibility = 'hidden';
        return element;
    },
    visible_show: function(element) {
        element = $(element);
        element.style.visibility = 'visible';
        return element;
    }
};

ess.forms = {
    toggleCheckbox: function(cb, key, input_id){
        if((key == 0 || key == 32) && $(input_id)){
            var input = $(input_id);
            if(input.checked){
                $(cb).removeClass('checked');
                $(cb).addClass('unchecked');
                input.checked = false;
            }else{
                $(cb).removeClass('unchecked');
                $(cb).addClass('checked');
                input.checked = true;
            }
        }
    }
};

ess.Math = {
    getRoundPrice: function (price) {
        var k = (Math.round(price * 100) / 100).toString();
        k += (k.indexOf('.') == -1)? '.00' : '00';
        var p = k.indexOf('.'), m = k.indexOf('-.');
        var f = (p == 0 || m == 0)? '0.' : '.';
        return k.substring(0, p) + f + k.substring(p+1, p+3);
    }
};

ess.Effects = {};

moduls.push('<br>Modul: MoveBox');
ess.Effects.MoveBox = new Class({
    initialize: function(box){
        this.box = $(box);
        this.status = false;
        this.boxSize = {x: 0, y: 0};
        this.winDim = {x: 0, y: 0};
    },
    show: function(){
        this.boxSize = this.box.getSize();
        this.winDim = window.getSize();
        document.addEvent('mousemove', this.onMouseMove.bindWithEvent(this));
        ess.Element.visible_show(this.box);
    },
    hide: function(){
        ess.Element.visible_hide(this.box);
        document.removeEvents('mousemove');
    },
    onMouseMove: function(e){
        var event = new Event(e);
        var mousePos = {x: event.client.x, y: event.client.y};
        var winScrollPos = window.getScroll();
        this.setBoxPosition(mousePos,winScrollPos);
    },
    setBoxPosition: function(mousePos,winScrollPos){
        var y = 0; var x = 0;
        if(mousePos.y + this.boxSize.y + 10 < this.winDim.y){
            y = mousePos.y + 10 + winScrollPos.y;
        }else{
            if(mousePos.y - this.boxSize.y - 10 >= 0){
                y = mousePos.y - this.boxSize.y - 10 + winScrollPos.y;
            }else{
                y = this.winDim.y - this.boxSize.y - 10 + winScrollPos.y;
            }
        }
        if(mousePos.x + this.boxSize.x + 10 < this.winDim.x){
            x = mousePos.x + 10 + winScrollPos.x;
        }else{
            if(mousePos.x - this.boxSize.x - 10 >= 0){
                x = mousePos.x - this.boxSize.x - 10 + winScrollPos.x;
            }else{
                x = this.winDim.x - this.boxSize.x - 5 + winScrollPos.x;
            }
        }
        this.box.setStyles({top: y, left: x});
    }
});

moduls.push('<br>Modul: SlideBox');
ess.Effects.oSlideBox = new Class({
    initialize: function(){
        this.attribute = 'slidebox';
        this.slideboxes = [];
        this.init();
    },
    init: function(){
        $('page').getElements('a['+this.attribute+']').each(function(el,i){
            var options = {};
            if(el.getProperty('slideboxoptions')) eval('options = '+el.getProperty('slideboxoptions')+';');
            $extend(options,{index: i, attribute: this.attribute});
            this.slideboxes[i] = new ess.Effects.SlideBox(el,options);
        }.bind(this));
    }
});

ess.Effects.SlideBox = new Class({
    Implements: Options,
    options: {
        index      : -1,
        attribute  : 'slidebox',
        slideBoxId : null,
        duration   : 200,
        transition : Fx.Transitions.Sine.easeInOut,
        effect     : 'toggle',
        effectStart: 'hide',
        mode       : 'vertical',
        onComplete : $empty
    },
    initialize: function(button, options){
        this.active = false;
        this.button = button;
        this.setOptions(options);
		if(this.options.index >= 0) this.button.setProperty('index',this.options.index);
		this.box = this.options.slideBoxId ? $(this.options.slideBoxId) : $(this.button.getProperty(this.options.attribute));
		if(!this.box) return;
		if(this.box.getStyle('position') == 'absolute'){
            var wrapper = this.box.retrieve('wrapper');
            this.wrapper = wrapper || new Element('div',{
                'class':'wrapper',
                'styles':{
                    position: 'absolute', visibility: 'hidden', overflow: 'hidden', top: this.box.getStyle('top').toInt(), left: this.box.getStyle('left').toInt(), zIndex: this.box.getStyle('zIndex')
                }
            }).wraps(this.box);
            this.box.store('wrapper', this.wrapper).setStyle('margin', 0);
            this.box.setStyles({position: 'static',display: 'block', visibility: 'visible'});
		}else{
		  this.box.setStyles({position: 'static',display: 'block', visibility: 'visible'});
		}
		var props = {
            duration   : this.options.duration,
            transition : this.options.transition,
            mode       : this.options.mode,
            onComplete : this.complete.bind(this)
        };
		this.action = new Fx.Slide(this.box, props);
		if(this.options.effectStart == 'hide') this.action.hide();
		if(this.options.effectStart == 'show') this.action.show();
		
		if(this.wrapper) this.wrapper.setStyle('visibility','visible');
		if(this.box.getStyle('visibility') == 'hidden') this.box.setStyle('visibility','visible');
		
		this.button.addEvent('click', function(e){
            this.active = true;
            e.stop();
            eval('this.action.'+this.options.effect+'();');
        }.bindWithEvent(this));
		
    },
    toggle: function(){
        this.active = true;
        this.action.toggle();
    },
    slideIn: function(){
        this.active = true;
        this.action.slideIn();
    },
    slideOut: function(){
        this.active = true;
        this.action.slideOut();
    },
    complete: function(e){
        if(this.action.open){
            if(!this.button.hasClass('open')) this.button.addClass('open');
        }else{
            this.button.removeClass('open');
        }
        this.active = false;
    },
    open: function(){
        return this.action.open;
    }
});

moduls.push('<br>Modul: Overlay');

ess.Effects.Overlay = new Class({
    Implements: Options,
    options: {
        colour    : '#000000',
        opacity   : 0.7,
		zIndex    : 10000,
		container : document.body,
		onClick   : Class.empty
    },
	initialize: function(options){
        this.setOptions(options);
        this.autoId = essBase.getNewId(true);
        this.options.container = $(this.options.container);
        this.container = new Element('div').setProperty('id', 'overlaycontainer'+this.autoId).setStyles({
            position: 'absolute', left: 0, top: 0, width: '100%', zIndex: this.options.zIndex
        }).injectInside(this.options.container);
        this.iframe = new Element('iframe').setProperties({
			'id': 'OverlayIframe'+this.autoId, 'name': 'OverlayIframe', 'src': 'javascript:void(0);', 'frameborder': 1, 'scrolling': 'no'
		}).setStyles({
			position: 'absolute', top: 0, left: 0, width: '100%', height: '100%', filter: 'progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)', 'opacity': 0, zIndex: this.options.zIndex
		}).injectInside(this.container);
		this.overlay = new Element('div').setProperty('id', 'overlay'+this.autoId).setStyles({
			position: 'absolute', left: '0', top: '0', width: '100%', height: '100%', zIndex: this.options.zIndex+1, backgroundColor: this.options.colour
		}).injectInside(this.container);
		this.container.addEvent('click', function(){
			this.options.onClick();
		}.bind(this));
		this.container.fade('hide');
		this.position();
		window.addEvent('resize', this.position.bind(this));
	},
	position: function(){ 
		if(this.options.container == document.body){ 
			var h = window.getScrollSize().y; 
			this.container.setStyles({top: '0', height: h+'px'}); 
		}else{ 
			var myCoords = this.options.container.getCoordinates(); 
			this.container.setStyles({top: myCoords.top+'px', height: myCoords.height+'px', left: myCoords.left+'px', width: myCoords.width+'px'}); 
		} 
	},
	show: function(){
		this.container.fade(this.options.opacity);
	},
	hide: function(){
		this.container.fade('hide');
	}
});
