
var AjaxCart = {
    
    init: function(options){
        this.options = $extend({
            cartWidth:          CART_WIDTH,
            cartHeight:         CART_HEIGHT,
            cartLeftOffset:     CART_LEFT_OFFSET,
            cartTop:            CART_TOP,
            slideInDuration:    SLIDEIN_DURATION,
            displayDuration:    DISPLAY_DURATION,
            cartId:             CART_ID,
            closeId:            CART_CLOSE_ID
        }, options || {});    
        this.popup = new Element('div', {'id': 'cartHolder'}).inject(document.body);
        popupCart = new Element('div', {'id': this.options.cartId}).inject(this.popup);        
		popupClose = new Element('div', {'id': this.options.closeId}).addEvent('click', function(){ this.hide(); }.bind(this)).inject(popupCart);    
        this.makeALink();        
		this.popupContent = new Element('div', {'id': 'ajaxCartContent'}).inject(popupCart);
        this.popup.setStyles({
            'width': this.options.cartWidth + 20,
            'top': this.options.cartTop,
            'display': 'none',
            'z-index': 1002
        });
        this.positionLeft();        
        window.addEvent('resize',function(e){ this.positionLeft(); }.bind(this));        
        popupCart.setStyles({
            'height': this.options.cartHeight,
            'width': this.options.cartWidth
        });
        
        this.slider = new Fx.Slide(this.options.cartId, {
	        wait: true,
	        transition: Fx.Transitions.Quad.easeInOut,
            duration: SLIDEIN_DURATION,
            onStart: function(){ 
                this.running = true;
                $('cartLink').removeEvents('mouseenter');                
                if(this.slider.open == true){
                    if($chk($('ajaxCartList'))){
                        $('ajaxCartList').setStyle('overflow-y', 'hidden');
                    }
                } 
            }.bind(this),
            onComplete: function() { 
                if(this.slider.open == false){   
                    if($chk($('detailMenu'))){ 
                        $('detailMenu').getElements('select').setStyle('visibility', 'visible') 
                    }
                    if($chk($('overlay1'))){
                        $('overlay1').destroy();
                    }
                    this.running = false;
                    this.makeALink.delay(100, this);
                } else{
                    if(this.mouseon != true){
                        this.firstTimer();
                    }
                    if($chk($('ajaxCartList'))){
                        $('ajaxCartList').setStyle('overflow-y', 'auto');
                    }
                }
            }.bind(this)
        }).hide();
    },
    
    positionLeft: function(){    
        this.popup.setStyles({
            'left': this.options.cartLeftOffset + (window.getWidth() / 2) + window.getScrollLeft()
        });
    },
    
    makeALink: function(){
        if($('cartcount').innerHTML > 0){        
            $('cartLink').addEvent(
                'mouseenter', function(e) {   
                    this.show()
                }.bind(this)
            )
        }
    },
    
    show: function(){ 
        if(this.running == true){
            return;
        }
        
        var timer = this.open.bind(this).delay(750);      
        $('cartLink').addEvent("mouseleave", function(){$clear(timer);});
    },
    
    open: function(){
        if(popupItem.overlay.style.opacity > 0){
            popupItem.close()
        }   
        if(!this.hasContent){
            this.showLoading();
        }
        if($chk($('detailMenu'))){ 
            $('detailMenu').getElements('select').setStyle('visibility', 'hidden') 
        }
        this.toggleSelects(true);
        this.popup.setStyles({'display': 'block'});        
        new Fx.Scroll(window, {duration: 500}).toTop();
        (function(){ 
            this.slider.slideIn();        
            if(!this.hasContent){            
                var ajaxUrl = '/cart.php';
                var ajaxOptions = {
                    url: ajaxUrl,                
                    update: $('ajaxCartContent'), 
                    evalScripts: 1,
                    onComplete: function(results){ 
                        this.hasContent = true;    
                    }.bind(this)
                }
                this.ajaxRequest = new Request.HTML(ajaxOptions).send('is_ajax=1');
            }
            $(this.options.cartId).addEvent('mouseover', function() { this.keepOpen(); }.bind(this))        
            $(this.options.cartId).addEvent('mouseleave', function() { this.setToClose(); }.bind(this));     
        }.bind(this)).delay(0);       
    },
    
    add: function(pid, myForm, showOverlay){
        if(popupItem.overlay.style.opacity > 0){
            popupItem.close()
        }    
        
        new Fx.Scroll(window, {
            duration: 500,
            onComplete: function(){
                if(showOverlay == true){
                    if(!$chk($('overlay1'))){ 
                        //this.toggleSelects(true);
                        this.overlay = new Element('div', {'id': 'overlay1'}).setStyle('opacity', 1).injectInside(document.body);
                        this.overlay.setStyles({
                            'display': 'block',
                            'z-index': 1000,
                            'left': 0, 
                            'top': window.getScrollTop(), 
                            'height': window.getHeight(),
                            'width': '100%',
                            'opacity': .3
                        });
                    }
                }
            }.bind(this)
        }).toTop();
        //
        this.hasContent = true;
        if(this.running === true){ return; } 
        var url = '/cart.php';
        url += (pid) ? '?p='+pid : '';
        this.show();
        
        $clear(this.timer);
        var ajaxOptions = {
            url: url,
            update: $('ajaxCartContent'),
            evalScripts: 1,
            onComplete: function(){
                this.firstTimer();
                this.makeALink();
            }.bind(this)
        }
        this.ajaxRequestAdd = new Request.HTML(ajaxOptions).post($(myForm));             
    },
    
    toggleSelects: function(open){
        var ie6 = Browser.Engine.trident4;
        ["object", ie6 ? "select" : "embed"].forEach(function(tag) {
			Array.forEach(document.getElementsByTagName(tag), function(el) {
				if (open) {
                    el.lbBackupStyle = el.style.visibility;
                    el.style.visibility = "hidden";
                } else {
                    if($defined(el.lbBackupStyle)){                        
                        el.style.visibility =  el.lbBackupStyle;
                    }
                }
			});
		}); 
    },
    
    firstTimer: function(){
        $clear(this.timer);
        this.timer = this.hide.delay(DISPLAY_DURATION,this);
    },
    
    keepOpen: function(){
        this.mouseon == true;
        $clear(this.timer);
    },
    
    setToClose: function(){
        this.mouseon == false;
        if(this.slider.open == true){
            $clear(this.timer);
            this.timer = this.hide.delay(1000,this)
        }
    },
    
    showLoading: function(){
        this.popupContent.set('html', '<br /><div style="text-align: center;"><img src="/images/ajax_loading.gif" /><br/>Loading...</div>');
    },
    
    hide: function(){        
        $clear(this.timer);
        this.slider.slideOut();
        if($defined(this.overlay)){
            this.overlay.destroy();
        }
        this.toggleSelects(false);
    },
    
    remove: function(sku){
        var url = '/cart.php?f=remove&sku='+sku;
        var ajaxOptions = {
            url: url,
            update: $('ajaxCartContent'),
            evalScripts: 1,
            onComplete: function(){
               this.hasContent = true;
            }.bind(this)
        }
        this.ajaxRequest = new Request.HTML(ajaxOptions).post({'is_ajax':1});     
    }
}

window.addEvent('domready', AjaxCart.init.bind(AjaxCart));

