// JavaScript Document

/*
	qShadows v0.2
	
	/script/jquery.qshadows.js
	
	$('div#container').qshadows({size:3});
	
	<div id="container">{content}</div>
	
	*requires dimensions plugin
	
*/

jQuery.fn.qshadows = function(options) {

	var settings = jQuery.extend({ 
		size:3,
		imagePath:'/images/shadows',
		insert: 'append',
		prefix: ''
	}, options);
	
	return this.each(function(){
		if($.browser.msie && /MSIE\s(5\.5|6\.)/.test(navigator.userAgent)){
			// no support yet
		}
		else{	
			if( $(this).css('position') != 'absolute' &&  $(this).css('position') != 'relative' &&  $(this).css('position') != 'fixed' ){
				$(this).css('position', 'relative');
			}
			
			var size = settings.size;
			var path = settings.imagePath;
			var pref = settings.prefix;
			
			var xhtml  = '<span class="shadow-t" style="position:absolute; background:url('+path+'/'+pref+'-t.png) repeat-x bottom center;"></span>';
				xhtml += '<span class="shadow-r" style="position:absolute; background:url('+path+'/'+pref+'-r.png) repeat-y center left;"></span>';
				xhtml += '<span class="shadow-b" style="position:absolute; background:url('+path+'/'+pref+'-b.png) repeat-x top center;"></span>';
				xhtml += '<span class="shadow-l" style="position:absolute; background:url('+path+'/'+pref+'-l.png) repeat-y center right;"></span>';
				xhtml += '<span class="shadow-tr" style="position:absolute; background:url('+path+'/'+pref+'-tr.png) no-repeat bottom left;"></span>';
				xhtml += '<span class="shadow-br" style="position:absolute; background:url('+path+'/'+pref+'-br.png) no-repeat top left;"></span>';
				xhtml += '<span class="shadow-bl" style="position:absolute; background:url('+path+'/'+pref+'-bl.png) no-repeat top right;"></span>';
				xhtml += '<span class="shadow-tl" style="position:absolute; background:url('+path+'/'+pref+'-tl.png) no-repeat bottom right;"></span>';
			
			switch(settings.insert){
				case 'prepend':
					$(this).prepend( xhtml );
				break;
				case 'html':
					$(this).html( xhtml );
				break;
				case 'append':
				default :
					$(this).append( xhtml );
				break;
			}
					
			$('div[class^=shadow-]', $(this)).css({position:'absolute'});
			
			$('.shadow-t, .shadow-tr, .shadow-tl', $(this)).css({top:'-'+size+'px', height:size+'px'});
			$('.shadow-tr, .shadow-r, .shadow-br', $(this)).css({right:'-'+size+'px', width:size+'px'});
			$('.shadow-br, .shadow-b, .shadow-bl', $(this)).css({bottom:'-'+size+'px', height:size+'px'});
			$('.shadow-bl, .shadow-l, .shadow-tl', $(this)).css({left:'-'+size+'px', width:size+'px'});
			$('.shadow-br, .shadow-b, .shadow-bl', $(this)).css({bottom:'-'+size+'px', height:size+'px'});
			$('.shadow-bl, .shadow-l, .shadow-lt', $(this)).css({left:'-'+size+'px', width:size+'px'});
			
			$('.shadow-t, .shadow-b', $(this)).css({left:'0px', width:'100%'});
			$('.shadow-l, .shadow-r', $(this)).css({top:'0px', height:'100%'});
		}
	});

};