/*
    tabSlideOUt v2.0
    
    By William Paoli: http://wpaoli.building58.com

    To use you must have an image ready to go as your tab
    Make sure to pass in at minimum the path to the image and its dimensions:
    
    example:
    
        $('.slide-out-div').tabSlideOut({
                tabHandle: '.handle',                         //class of the element that will be your tab -doesnt have to be an anchor
                pathToTabImage: 'images/contact_tab.gif',     //relative path to the image for the tab *required*
                imageHeight: '133px',                         //height of tab image *required*
                imageWidth: '44px',                           //width of tab image *required*    
        });

    
*/


(function($){
    $.fn.tabSlideOut = function(callerSettings) {
        var settings = $.extend({
            tabHandle: '.handle',
			toggleButton: '.tab-opener',
            speed: 300,
            action: 'click',
            tabLocation: 'left',
            topPos: '200px',
            leftPos: '20px',
            defaultHeight: 122,			
            fixedPosition: false,
            positioning: 'absolute',
            pathToTabImage: null,
            pathToTabImageClose: null,			
            imageHeight: null,
            imageWidth: null,
			handleOffset: '0',
            onLoadSlideOut: false,
            onOpen: function(){},
            onClose: function(){},
			firstLoad: true
        }, callerSettings||{});

        settings.tabHandle = $(settings.tabHandle);
        settings.toggleButton = $(settings.toggleButton);

        var obj = this;
		obj.height(settings.defaultHeight-4);	
		
        if (settings.fixedPosition === true) {
            settings.positioning = 'fixed';
        } else {
            settings.positioning = 'absolute';
        }
        
        //ie6 doesn't do well with the fixed option
        if (document.all && !window.opera && !window.XMLHttpRequest) {
            settings.positioning = 'absolute';
        }
        
        //set initial tabHandle css
        if (settings.pathToTabImage !== null) {
            settings.tabHandle.css({
            'background' : 'url('+settings.pathToTabImage+') no-repeat',
            'width' : settings.imageWidth,
            'height': settings.imageHeight,
			'border': '2px solid #350000',
			'margin-top': '-2px',
			'cursor'	: 'hand',
			'cursor'	: 'pointer',			

            });
        }       
		settings.tabHandle.css({
			'display': 'block',
			'textIndent' : '-99999px',
			'outline' : 'none',
			'position' : 'absolute'
		});
		        
        obj.css({
            'line-height' : '1',
            'position' : settings.positioning
        });

        
        var properties = {
                    containerWidth: parseInt(obj.outerWidth(), 10) + 'px',
                    containerHeight: parseInt(obj.outerHeight(), 10) + 'px',
                    tabWidth: parseInt(settings.tabHandle.outerWidth(), 10) + 'px',
                    tabHeight: parseInt(settings.tabHandle.outerHeight(), 10) + 'px'
                };

        //set calculated css
        if(settings.tabLocation === 'top' || settings.tabLocation === 'bottom') {
            obj.css({'left' : settings.leftPos});
            settings.tabHandle.css({'right' : settings.handleOffset + 'px'});
        }
        
        if(settings.tabLocation === 'top') {
            obj.css({'top' : '-' + properties.containerHeight});
            settings.tabHandle.css({'bottom' : '-' + properties.tabHeight});
        }

        if(settings.tabLocation === 'bottom') {
            obj.css({'bottom' : '-' + properties.containerHeight, 'position' : 'fixed'});
            settings.tabHandle.css({'top' : '-' + properties.tabHeight});
            
        }
        
        if(settings.tabLocation === 'left' || settings.tabLocation === 'right') {
            obj.css({
                'height' : properties.containerHeight,
                'top' : settings.topPos
            });
            
            settings.tabHandle.css({'top' : settings.handleOffset + 'px'});
        }
        
        if(settings.tabLocation === 'left') {
            obj.css({ 'left': '-' + properties.containerWidth});
            settings.tabHandle.css({'right' : '-' + properties.tabWidth});
        }

        if(settings.tabLocation === 'right') {
            obj.css({ 'right': '-' + properties.containerWidth});
            settings.tabHandle.css({'left' : '-' + properties.tabWidth});
            
            $('html').css('overflow-x', 'hidden');
        }

        //functions for animation events
        
        settings.tabHandle.click(function(event){
            event.preventDefault();
        });
        settings.toggleButton.click(function(event){
            event.preventDefault();
        });

        var fixPos = function() {
			properties.containerWidth =parseInt(obj.outerWidth(), 10) + 'px';
            properties.containerHeight=parseInt(obj.outerHeight(), 10) + 'px';
            
            if (settings.tabLocation === 'top') {
                obj.animate({top:'-' + properties.containerHeight}, settings.speed, settings.onClose()).removeClass('open');
            } else if (settings.tabLocation === 'left') {
                obj.animate({left: '-' + properties.containerWidth}, settings.speed, settings.onClose()).removeClass('open');
            } else if (settings.tabLocation === 'right') {
                obj.animate({right: '-' + properties.containerWidth}, settings.speed, settings.onClose()).removeClass('open');
            } else if (settings.tabLocation === 'bottom') {
                obj.animate({bottom: '-' + properties.containerHeight}, settings.speed, settings.onClose()).removeClass('open');
            }    
            
        };
        
        var slideIn = function() {
			properties.containerWidth =parseInt(obj.outerWidth(), 10) + 'px';
            properties.containerHeight=parseInt(obj.outerHeight(), 10) + 'px';
            
            if (settings.tabLocation === 'top') {
                obj.animate({top:'-' + properties.containerHeight}, settings.speed, settings.onClose()).removeClass('open');
            } else if (settings.tabLocation === 'left') {
                obj.animate({left: '-' + properties.containerWidth}, settings.speed, settings.onClose()).removeClass('open');
            } else if (settings.tabLocation === 'right') {
                obj.animate({right: '-' + properties.containerWidth}, settings.speed, settings.onClose()).removeClass('open');
            } else if (settings.tabLocation === 'bottom') {
                obj.animate({bottom: '-' + properties.containerHeight}, settings.speed, settings.onClose()).removeClass('open');
            }    
			//
			settings.tabHandle.css('background','url('+settings.pathToTabImage+') no-repeat');
            
        };
        var jumpIn = function() {
			properties.containerWidth =parseInt(obj.outerWidth(), 10) + 'px';
            properties.containerHeight=parseInt(obj.outerHeight(), 10) + 'px';
            
            if (settings.tabLocation === 'top') {
                obj.css({'top':'-' + properties.containerHeight});
            } else if (settings.tabLocation === 'left') {
                obj.css({'left':'-' + properties.containerWidth});			
            } else if (settings.tabLocation === 'right') {
                obj.css({'right':'-' + properties.containerWidth});			
            } else if (settings.tabLocation === 'bottom') {
                obj.css({'bottom':'-' + properties.containerHeight});			
            }
			//
			settings.tabHandle.css('background','url('+settings.pathToTabImage+') no-repeat');
        };		
        
        var slideOut = function() {
			properties.containerWidth =parseInt(obj.outerWidth(), 10) + 'px';
            properties.containerHeight=parseInt(obj.outerHeight(), 10) + 'px';
            
            if (settings.tabLocation === 'top') {
                obj.animate({top:'-3px'},  settings.speed, settings.onOpen()).addClass('open');
            } else if (settings.tabLocation === 'left') {
                obj.animate({left:'-3px'},  settings.speed, settings.onOpen()).addClass('open');
            } else if (settings.tabLocation === 'right') {
                obj.animate({right:'-3px'},  settings.speed, settings.onOpen()).addClass('open');
            } else if (settings.tabLocation === 'bottom') {
                obj.animate({bottom:'-3px'},  settings.speed, settings.onOpen()).addClass('open');
            }
			//
			settings.tabHandle.css('background','url('+settings.pathToTabImageClose+') no-repeat');
        };

        var jumpOut = function() {
			properties.containerWidth =parseInt(obj.outerWidth(), 10) + 'px';
            properties.containerHeight=parseInt(obj.outerHeight(), 10) + 'px';
            
            if (settings.tabLocation === 'top') {
                obj.css({'top':'-3px'});
            } else if (settings.tabLocation === 'left') {
                obj.css({'left':'-3px'});			
            } else if (settings.tabLocation === 'right') {
                obj.css({'right':'-3px'});			
            } else if (settings.tabLocation === 'bottom') {
                obj.css({'bottom':'-3px'});			
            }
			//
			settings.tabHandle.css('background','url('+settings.pathToTabImageClose+') no-repeat');
        };
		

        var clickScreenToClose = function() {
            obj.click(function(event){
                event.stopPropagation();
            });

			settings.toggleButton.click(function(event){
                event.stopPropagation();
            });
            
            $(document).click(function(){
                slideIn();
            });
        };
        
        var clickAction = function(){	
            settings.tabHandle.click(function(event){
                if (obj.hasClass('open')) {
                    slideIn();
                } else {
                    slideOut();
                }
            });
            settings.toggleButton.click(function(event){
                if (obj.hasClass('open')) {
                    slideIn();
                } else {
                    slideOut();
                }
            });
           // clickScreenToClose();
        };
        
        var hoverAction = function(){
            obj.hover(
                function(){
                if (!obj.hasClass('open')) {
                     slideOut();
				}
                },
                
                function(){
                  if (obj.hasClass('open')) {
					setTimeout(slideIn, 1000);
				}
                });
                
                settings.tabHandle.click(function(event){
                    if (obj.hasClass('open')) {
                        slideIn();
                    }
                });

               settings.toggleButton.click(function(event){
                   if (obj.hasClass('open')) {
                       slideIn();
                   } else {
                       slideOut();
                   }
               });   
               //clickScreenToClose();
                
        };
        
        var slideOutOnLoad = function(){
            slideIn();
            setTimeout(slideOut, 500);
        };
        
        //choose which type of action to bind
        if (settings.action === 'click') {
            clickAction();
        }
        
        if (settings.action === 'hover') {
            hoverAction();
        }
        
        if (settings.onLoadSlideOut) {
            slideOutOnLoad();
        }
		
		obj.bind('updateJcartTab',function(e,data){ 
			var height=data.height;
			var width=data.width;
			if (height> settings.defaultHeight){
				obj.height(height);
			}else{	
				obj.height(settings.defaultHeight);							
			}	
			if (obj.hasClass('open')) {
                jumpOut();
            } else {
                jumpIn();
				//when updated slide out				
				if (settings.firstLoad==true){				
					settings.firstLoad=false;
				}else{
					slideOut();							
				}
            }		
			
			
		});

        
    };
})(jQuery);