/*
tabSlideOUt v1.3

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',
			speed: 300,
			action: 'click',
			tabLocation: 'left',
			topPos: '200px',
			leftPos: '20px',
			fixedPosition: false,
			positioning: 'absolute',
			pathToTabImage: null,
			imageHeight: null,
			imageWidth: null,
			onLoadSlideOut: false
		}, callerSettings||{});

		settings.tabHandle = $(settings.tabHandle);
		var obj = this;
		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
			});
		}

		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' : 0});
		}

		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' : 0});
		}

		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();
		});

		var slideIn = function() {

			if (settings.tabLocation === 'top') {
				obj.animate({top:'-' + properties.containerHeight}, settings.speed).removeClass('open');
			} else if (settings.tabLocation === 'left') {
				obj.animate({left: '-' + properties.containerWidth}, settings.speed).removeClass('open');
			} else if (settings.tabLocation === 'right') {
				obj.animate({right: '-' + properties.containerWidth}, settings.speed).removeClass('open');
			} else if (settings.tabLocation === 'bottom') {
				obj.animate({bottom: '-' + properties.containerHeight}, settings.speed).removeClass('open');
			}

		};

		var slideOut = function() {

			if (settings.tabLocation == 'top') {
				obj.animate({top:'-3px'},  settings.speed).addClass('open');
			} else if (settings.tabLocation == 'left') {
				obj.animate({left:'-3px'},  settings.speed).addClass('open');
			} else if (settings.tabLocation == 'right') {
				obj.animate({right:'-3px'},  settings.speed).addClass('open');
			} else if (settings.tabLocation == 'bottom') {
				obj.animate({bottom:'-3px'},  settings.speed).addClass('open');
			}
		};

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

			$(document).click(function(){
				slideIn();
			});
		};

		var clickAction = function(){
			settings.tabHandle.click(function(event){
				if (obj.hasClass('open')) {
					slideIn();
				} else {
					slideOut();
				}
			});

			clickScreenToClose();
		};

		var hoverAction = function(){
			obj.hover(
			function(){
				slideOut();
			},

			function(){
				slideIn();
			});

			settings.tabHandle.click(function(event){
				if (obj.hasClass('open')) {
					slideIn();
				}
			});
			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();
		};

	};
})(jQuery);

