(function($) {

	$.fn.glowEnable  = function() { return $(this).find("+ .fx-glow").show().end();   };
	$.fn.glowDisable = function() { return $(this).find("+ .fx-glow").hide().end();   };
	$.fn.glowDestroy = function() { return $(this).find("+ .fx-glow").remove().end(); };
	
	$.fn.glow = function(options) {
		options = $.extend({
			offset:  1,
			opacity: 0.2,
            color:   "#000",
			shadow:   "right",
			monitor: false
		}, options || {});
		options.offset -= 1;
		
		return this.each(function() {
			
			// Remove an existing glow if it exists
			var $element = $(this).glowDestroy(),
			
			// Create a glow element
			$glow = $("<div class='fx-glow' style='position: relative;'></div>").insertAfter($element);
			
			// Figure the base height and width
			baseWidth  = ($element.outerWidth() != parseInt($element.css("width")) ? parseInt($element.css("width")) :$element.outerWidth()), // fix for ie6, cause ie fits width to its displayed width, not the given from css
            baseHeight = $element.outerHeight(),
			
			// Get the offset
			position = $element.position(),
			
			// Get z-index
			zIndex = parseInt($element.css("zIndex")) || 0;
			
            if (options.shadow == "LowerRight") {
                // Append smooth corners
                $('<div id="fx-glow-color" class="fx-glow-layer-1" style="background: url(templates/jwd03/img/shadow_right.png) repeat-y; background-color:none;"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 7,      top: 5, width: 20, height: baseHeight - 11 }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-2" style="background: url(templates/jwd03/img/shadow_lowerright.png) repeat-y; background-color:none;"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 10,      top: baseHeight - 6 , width: 20, height: 20 }).appendTo($glow);

                $('<div id="fx-glow-color" class="fx-glow-layer-3" style="background: url(templates/jwd03/img/shadow_bottom.png) repeat-x; background-color:none;"></div>').css({ position: 'absolute', left: options.offset + 1,      top: baseHeight - 1, width: baseWidth - 11, height: 20 }).appendTo($glow);
            } else
            if (options.shadow == "LowerRightLines") {
//                 Append smooth corners
                $('<div id="fx-glow-color" class="fx-glow-layer-80"></div>').css({ position: 'absolute', opacity: 0.15,  left: 2,  top: 2,     width: baseWidth + 1,   height: baseHeight + 1 }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-81"></div>').css({ position: 'absolute', opacity: 0.10,  left: 4,  top: 4,     width: baseWidth,       height: baseHeight - 2 }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-82"></div>').css({ position: 'absolute', opacity: 0.10,  left: 4,  top: 4,     width: baseWidth - 3,   height: baseHeight     }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-83"></div>').css({ position: 'absolute', opacity: 0.20,  left: 3,  top: 3,     width: baseWidth - 1,   height: baseHeight - 1 }).appendTo($glow);
//                $('<div id="fx-glow-color" class="fx-glow-layer-17"></div>').css({ position: 'absolute', opacity: options.opacity -0.15,  left: options.offset - 5,  top: options.offset - 5,     width: baseWidth,   height: baseHeight + 1 }).appendTo($glow);
//                $('<div id="fx-glow-color" class="fx-glow-layer-18"></div>').css({ position: 'absolute', opacity: options.opacity -0.15,  left: options.offset - 3,  top: options.offset - 3,     width: baseWidth,   height: baseHeight - 3 }).appendTo($glow);
//                $('<div id="fx-glow-color" class="fx-glow-layer-19"></div>').css({ position: 'absolute', opacity: options.opacity -0.15,  left: options.offset - 1,  top: options.offset - 1,     width: baseWidth,   height: baseHeight     }).appendTo($glow);
//                $('<div id="fx-glow-color" class="fx-glow-layer-20"></div>').css({ position: 'absolute', opacity: options.opacity -0.15,  left: options.offset,      top: options.offset,         width: baseWidth,   height: baseHeight - 1 }).appendTo($glow);
            } else

			if (options.shadow == "UpperLeftRounded") {
                // Append smooth corners
                // top
                $('<div id="fx-UpperLeftRound" class="fxImgLeft"></div>').css({ position: 'absolute',  left: options.offset - 23, top: 10, width: 20,             height: baseHeight - 510 }).appendTo($glow);
                $('<div id="fx-UpperLeftRound" class="fxImgFadeLeft"></div>').css({ position: 'absolute',  left: options.offset - 23, top: baseHeight - 500, width: 20,             height: 500 }).appendTo($glow);
                $('<div id="fx-UpperLeftRound" class="fxImgUpperLeftRounded"></div>').css({ position: 'absolute',  left: options.offset - 14, top: -10, width: 20,             height: 20 }).appendTo($glow);

                $('<div id="fx-UpperLeftRound" class="fxImgTop"></div>').css({ position: 'absolute', left: options.offset + 6,      top: -20, width: baseWidth - 510, height: 20 }).appendTo($glow);
                $('<div id="fx-UpperLeftRound" class="fxImgFadeUpperLeft"></div>').css({ position: 'absolute', left: baseWidth - 500,      top: -19, width: 500, height: 20 }).appendTo($glow);
                
            } else 
            if (options.shadow == "right") {
                // Append smooth corners
                $('<div id="fx-glow-color" class="fx-glow-layer-9" style="background: url(templates/jwd03/img/shadow_right.png) repeat-y; background-color:none;"></div>').css({ position: 'absolute', left: options.offset + baseWidth,      top: 0, width: 20, height: baseHeight - 500 }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-10" style="background: url(templates/jwd03/img/shadow_faderight.png) repeat-y bottom; background-color:none;"></div>').css({ position: 'absolute', left: options.offset + baseWidth,      top: baseHeight - 500, width: 20, height: 500 }).appendTo($glow);
                
            } else 
            if (options.shadow == "UpperRightRounded") {
                // Append smooth corners
                $('<div id="fx-UpperRightRounded" class="fxImgRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth -1,      top: 10, width: 20, height: baseHeight - 510 }).appendTo($glow);
                $('<div id="fx-UpperRightRounded" class="fxImgFadeRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 1,      top: baseHeight - 500, width: 20, height: 500 }).appendTo($glow);
                $('<div id="fx-UpperRightRounded" class="fxImgUpperRightRounded"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 10,      top: -10, width: 20, height: 20 }).appendTo($glow);

                $('<div id="fx-UpperRightRounded" class="fxImgTop"></div>').css({ position: 'absolute', left: options.offset + 6 + 500,      top: -20, width: baseWidth - 516, height: 20 }).appendTo($glow);
                $('<div id="fx-UpperRightRounded" class="fxImgFadeUpperRight"></div>').css({ position: 'absolute', left: options.offset + 6,      top: -19, width: 500, height: 20 }).appendTo($glow);
                
            } else 
            if (options.shadow == "UpperRightRoundedLayered") {
                // Append smooth corners
                $('<div id="fx-UpperRightRounded" class="fxImgRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth -1,      top: 10, width: 20, height: baseHeight - 510 }).appendTo($glow);
                $('<div id="fx-UpperRightRounded" class="fxImgFadeRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 1,      top: baseHeight - 500, width: 20, height: 500 }).appendTo($glow);
//                $('<div id="fx-UpperRightRounded" class="fxImgUpperRightRounded"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 10,      top: -10, width: 20, height: 20 }).appendTo($glow);
                $('<div id="fx-UpperRightRounded" class="fxImgUpperRightRounded2"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 10,      top: -10, width: 20, height: 20 }).appendTo($glow);

                $('<div id="fx-UpperRightRounded" class="fxImgTop"></div>').css({ position: 'absolute', left: options.offset + 6 + 500,      top: -20, width: baseWidth - 516, height: 20 }).appendTo($glow);
                $('<div id="fx-UpperRightRounded" class="fxImgFadeUpperRight"></div>').css({ position: 'absolute', left: options.offset + 6,      top: -19, width: 500, height: 20 }).appendTo($glow);
                
            } else 
            if (options.shadow == "Bottom") {
                // Append smooth corners
                $('<div id="fx-glow-color" class="fx-glow-layer-16" style="background: url(templates/jwd03/img/shadow_bottom.png) repeat-x; background-color:none; z-index:999;"></div>').css({ position: 'absolute', left: options.offset + 1,      top: baseHeight, width: baseWidth, height: 20 }).appendTo($glow);
//                zIndex = 850;
            } else 
            if (options.shadow == "lefttop") {
                // Append smooth corners
                $('<div id="fx-glow-color" class="fx-glow-layer-17"></div>').css({ position: 'absolute', opacity: options.opacity -0.15,  left: options.offset - 5,  top: options.offset - 5,     width: baseWidth,   height: baseHeight + 1 }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-18"></div>').css({ position: 'absolute', opacity: options.opacity -0.15,  left: options.offset - 3,  top: options.offset - 3,     width: baseWidth,   height: baseHeight - 3 }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-19"></div>').css({ position: 'absolute', opacity: options.opacity -0.15,  left: options.offset - 1,  top: options.offset - 1,     width: baseWidth,   height: baseHeight     }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-20"></div>').css({ position: 'absolute', opacity: options.opacity -0.15,  left: options.offset,      top: options.offset,         width: baseWidth,   height: baseHeight - 1 }).appendTo($glow);
            } else
            if (options.shadow == "aroundCorners") {
                // Append smooth corners
                $('<div id="fx-AroundCorners" class="fxImgLeft""></div>').css({              position: 'absolute', left: options.offset - 23, top: 10,               width: 20, height: baseHeight - 510 }).appendTo($glow);
                $('<div id="fx-AroundCorners" class="fxImgFadeLeft""></div>').css({          position: 'absolute', left: options.offset - 23, top: baseHeight - 500, width: 20, height: 500 }).appendTo($glow);
                $('<div id="fx-AroundCorners" class="fxImgUpperLeftRounded""></div>').css({  position: 'absolute', left: options.offset - 14, top: -10,              width: 20, height: 20 }).appendTo($glow);

                $('<div id="fx-AroundCorners" class="fxImgRight""></div>').css({             position: 'absolute', left: options.offset + baseWidth - 5,  top: 10,               width: 20, height: baseHeight - 510 }).appendTo($glow);
                $('<div id="fx-AroundCorners" class="fxImgFadeRight""></div>').css({         position: 'absolute', left: options.offset + baseWidth - 5,  top: baseHeight - 500, width: 20, height: 500 }).appendTo($glow);
                $('<div id="fx-AroundCorners" class="fxImgUpperRightRounded""></div>').css({ position: 'absolute', left: options.offset + baseWidth - 14, top: -10,              width: 20, height: 20 }).appendTo($glow);

                $('<div id="fx-AroundCorners" class="fxImgTop""></div>').css({               position: 'absolute', left: options.offset + 6,  top: -20,              width: baseWidth - 20, height: 20 }).appendTo($glow);
            } else
            if (options.shadow == "aroundCornersLayered") {
                // Append smooth corners
                $('<div id="fx-AroundCornersLayered" class="fxImgLeft"></div>').css({ position: 'absolute',  left: options.offset - 23, top: 10, width: 20,             height: baseHeight - 510 }).appendTo($glow);
                $('<div id="fx-AroundCornersLayered" class="fxImgFadeLeft"></div>').css({ position: 'absolute',  left: options.offset - 23, top: baseHeight - 500, width: 20,             height: 500 }).appendTo($glow);
                $('<div id="fx-AroundCornersLayered" class="fxImgUpperLeftRounded2"></div>').css({ position: 'absolute',  left: options.offset - 14, top: -10, width: 20,             height: 20 }).appendTo($glow);

                $('<div id="fx-AroundCornersLayered" class="fxImgRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 5,      top: 10, width: 20, height: baseHeight - 510 }).appendTo($glow);
                $('<div id="fx-AroundCornersLayered" class="fxImgFadeRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 5,      top: baseHeight - 500, width: 20, height: 500 }).appendTo($glow);
                $('<div id="fx-AroundCornersLayered" class="fxImgUpperRightRounded2"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 14,      top: -10, width: 20, height: 20 }).appendTo($glow);

                $('<div id="fx-AroundCornersLayered" class="fxImgTop"></div>').css({ position: 'absolute', left: options.offset + 6,      top: -20, width: baseWidth - 20, height: 20 }).appendTo($glow);
            } else
            if (options.shadow == "around") {
                // Append smooth corners
                $('<div id="fx-Around" class="fxImgLeft"></div>').css({ position: 'absolute',  left: options.offset - 23, top: 5, width: 20,             height: baseHeight - 505}).appendTo($glow);
                $('<div id="fx-Around" class="fxImgFadeLeft"></div>').css({ position: 'absolute',  left: options.offset - 23, top: baseHeight - 500, width: 20,             height: 500 }).appendTo($glow);
                $('<div id="fx-Around" class="fxImgUpperLeft"></div>').css({ position: 'absolute',  left: options.offset - 19, top: -15, width: 20,             height: 20 }).appendTo($glow);

                $('<div id="fx-Around" class="fxImgRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 5,      top: 5, width: 20, height: baseHeight - 505}).appendTo($glow);
                $('<div id="fx-Around" class="fxImgFadeRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 5,      top: baseHeight - 500, width: 20, height: 500 }).appendTo($glow);
                $('<div id="fx-Around" class="fxImgUpperRight""></div>').css({ position: 'absolute', left: options.offset + baseWidth - 9,      top: -15, width: 20, height: 20 }).appendTo($glow);

                $('<div id="fx-Around" class="fxImgTop"></div>').css({ position: 'absolute', left: options.offset + 1,      top: -20, width: baseWidth - 10, height: 20 }).appendTo($glow);
                

            } else
            if (options.shadow == "sites") {
                // Append smooth corners
                // left
                $('<div id="fx-glow-color" class="fx-glow-layer-35" style="filter:alpha(opacity=5);"></div>').css({ position: 'absolute', opacity: 0.05,  left: options.offset - 3, top: options.offset + 2, width: baseWidth, height: baseHeight }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-36" style="filter:alpha(opacity=5);"></div>').css({ position: 'absolute', opacity: 0.05,  left: options.offset - 2, top: options.offset + 1, width: baseWidth,     height: baseHeight }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-37" style="filter:alpha(opacity=5);"></div>').css({ position: 'absolute', opacity: 0.05,  left: options.offset , top: options.offset + 0, width: baseWidth, height: baseHeight     }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-38" style="filter:alpha(opacity=5);"></div>').css({ position: 'absolute', opacity: 0.05,  left: options.offset +1, top: options.offset , width: baseWidth+2, height: baseHeight }).appendTo($glow);

                // right
                $('<div id="fx-glow-color" class="fx-glow-layer-39" style="filter:alpha(opacity=5);"></div>').css({  position: 'absolute', opacity: 0.05,  left: options.offset + 1, top: options.offset + 3, width: baseWidth + 4, height: baseHeight }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-40" style="filter:alpha(opacity=5);"></div>').css({  position: 'absolute', opacity: 0.05,  left: options.offset + 1, top: options.offset + 2, width: baseWidth + 3,     height: baseHeight }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-41" style="filter:alpha(opacity=5);"></div>').css({ position: 'absolute', opacity: 0.05,  left: options.offset + 1, top: options.offset + 1, width: baseWidth + 2, height: baseHeight     }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-42" style="filter:alpha(opacity=5);"></div>').css({ position: 'absolute', opacity: 0.05,  left: options.offset + 1, top: options.offset + 0, width: baseWidth + 1, height: baseHeight }).appendTo($glow);

            } 
			
			// Add color
//			$("div.fx-glow-color", $glow).css("background-color", options.color);
			
			// Set zIndex +1 and make sure position is at least relative
			// Attention: the zIndex will get one higher!
			$element
				.css({
					zIndex: zIndex + 1,
					position: ($element.css("position") == "static" ? "relative" : "")
				});
			
			// Copy the original z-index and position to the clone
			// alert(glow); If you insert this alert, opera will time correctly!!
            $glow.css({
				position:     "absolute",
				zIndex:       (options.shadow == "aroundCornersLayered" || options.shadow == "UpperRightRoundedLayered" ? '501' : zIndex),
				top:          position.top+"px",
				left:         position.left+"px",
				width:        baseWidth,
				height:       (options.shadow == "aroundCornersLayered" || options.shadow == "UpperRightRoundedLayered" ? 1 : baseHeight),
				marginLeft:   $element.css("marginLeft"),
				marginRight:  $element.css("marginRight"),
				marginBottom: $element.css("marginBottom"),
				marginTop:    $element.css("marginTop")
			});
			
			
			if ( options.monitor ) {
				function rearrangeglow() {
					var $element = $(this), $glow = $element.next();
					// $glow.css( $element.position() );
					$glow.css({
						top:  parseInt($element.css("top"))  +"px",
						left: parseInt($element.css("left")) +"px"
					})
					$(">*", $glow).css({ height: this.offsetHeight+"px", width: this.offsetWidth+"px" });
				}
			
				// Attempt to use DOMAttrModified event
				$element.bind("DOMAttrModified", rearrangeglow);
			
				// Use expressions if they exist (IE)
				if( $glow[0].style.setExpression ) {
					$glow[0].style.setExpression("top" , "parseInt(this.previousSibling.currentStyle.top ) + 'px'");
					$glow[0].style.setExpression("left", "parseInt(this.previousSibling.currentStyle.left) + 'px'");
				}
			}

		});
	};
	
})(jQuery);
