$(window).load(function() {
    $('div.dropShadowGlow').glow({ color: "#969696", offset: 5, opacity: 0.2, shadow: "around" });
    $('div.dropShadowGlowRounded').glow({ color: "#969696", offset: 5, opacity: 0.2, shadow: "aroundCorners" });
    $('div.dropShadowGlowRoundedLayered').glow({ color: "#969696", offset: 5, opacity: 0.2, shadow: "aroundCornersLayered" });
    $('div.dropShadowUpperLeft').glow({ color: "#969696", offset: 5, opacity: 0.2, shadow: "UpperLeftRounded" });
    $('div.dropShadowUpperLeftLayered').glow({ color: "#969696", offset: 5, opacity: 0.2, shadow: "UpperLeftRoundedLayered" });
    $('div.dropShadowUpperRight').glow({ color: "#444", offset: 0, opacity: 0.4, shadow: "UpperRightRounded" });
    $('div.dropShadowUpperRightLayered').glow({ color: "#444", offset: 0, opacity: 0.4, shadow: "UpperRightRoundedLayered" });
    $('div.dropShadowLowerRight').glow({ color: "#737373", offset: 5, opacity: 0.2, shadow: "LowerRight" });
    $('div.dropShadowLowerRightLines').glow({ color: "#737373", offset: 3, opacity: 0.2, shadow: "LowerRightLines" });
    $('div.dropShadowFadeLeft').glow({ color: "#737373", offset: 3, opacity: 0.2, shadow: "FadeLeft" });
});

(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",
            objID:      false,
			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='" + (options.objID!==false ? options.objID : "fx-glow") + "' style='position: relative; display:none;'></div>").insertAfter($element);
			
			// Figure the base height and width
			var 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-LowerRight" class="fxImgRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 12,      top: 0, width: 20, height: baseHeight - 6 }).appendTo($glow);
                $('<div id="fx-LowerRight" class="fxImgLowerRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 16,      top: baseHeight - 6 , width: 20, height: 20 }).appendTo($glow);
                $('<div id="fx-LowerRight" class="fxImgBottom"></div>').css({ position: 'absolute', left: options.offset + 1,      top: baseHeight - 1, width: baseWidth - 12, 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.10,  left: 1,  top: 1,     width: baseWidth + 1,   height: baseHeight + 1 }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-81"></div>').css({ position: 'absolute', opacity: 0.05,  left: 3,  top: 3,     width: baseWidth,       height: baseHeight - 2 }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-82"></div>').css({ position: 'absolute', opacity: 0.05,  left: 3,  top: 3,     width: baseWidth - 3,   height: baseHeight     }).appendTo($glow);
                $('<div id="fx-glow-color" class="fx-glow-layer-83"></div>').css({ position: 'absolute', opacity: 0.15,  left: 2,  top: 2,     width: baseWidth - 1,   height: baseHeight - 1 }).appendTo($glow);
            } else
            if (options.shadow == "UpperLeftRounded") {
                // Append smooth corners
                $('<div id="fx-UpperLeftRound" class="fxImgLeft"></div>').css({ position: 'absolute',  left: options.offset - 23, top: 10, width: 20,             height: baseHeight - 310 }).appendTo($glow);
                $('<div id="fx-UpperLeftRound" class="fxImgFadeLeft"></div>').css({ position: 'absolute',  left: options.offset - 23, top: baseHeight - 300, width: 20,             height: 300 }).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 - 310, height: 20 }).appendTo($glow);
                $('<div id="fx-UpperLeftRound" class="fxImgFadeUpperLeft"></div>').css({ position: 'absolute', left: baseWidth - 300,      top: -19, width: 300, height: 20 }).appendTo($glow);
                
            } else 
			if (options.shadow == "UpperLeftRoundedLayered") {
                // Append smooth corners
                $('<div id="fx-UpperLeftRound" class="fxImgLeft"></div>').css({ position: 'absolute',  left: options.offset - 23, top: 10, width: 20,             height: baseHeight - 310 }).appendTo($glow);
                $('<div id="fx-UpperLeftRound" class="fxImgFadeLeft"></div>').css({ position: 'absolute',  left: options.offset - 23, top: baseHeight - 300, width: 20,             height: 300 }).appendTo($glow);
                $('<div id="fx-UpperLeftRound" class="fxImgUpperLeftRounded2"></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 - 310, height: 20 }).appendTo($glow);
                $('<div id="fx-UpperLeftRound" class="fxImgFadeUpperLeft"></div>').css({ position: 'absolute', left: baseWidth - 300,      top: -19, width: 300, height: 20 }).appendTo($glow);
                
            } else 
            if (options.shadow == "UpperRightRounded") {
                // Append smooth corners
                $('<div id="fx-UpperRightRounded" class="fxImgRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth ,      top: 10, width: 20, height: baseHeight - 310 }).appendTo($glow);
                $('<div id="fx-UpperRightRounded" class="fxImgFadeRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth ,      top: baseHeight - 300, width: 20, height: 300 }).appendTo($glow);
                $('<div id="fx-UpperRightRounded" class="fxImgUpperRightRounded"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 9,      top: -10, width: 20, height: 20 }).appendTo($glow);

                $('<div id="fx-UpperRightRounded" class="fxImgTop"></div>').css({ position: 'absolute', left: options.offset + 7 + 350,      top: -20, width: baseWidth - 366, height: 20 }).appendTo($glow);
                $('<div id="fx-UpperRightRounded" class="fxImgFadeUpperRight"></div>').css({ position: 'absolute', left: options.offset + 57,      top: -19, width: 300, 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 - 310 }).appendTo($glow);
                $('<div id="fx-UpperRightRounded" class="fxImgFadeRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 1,      top: baseHeight - 300, width: 20, height: 300 }).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 + 300,      top: -20, width: baseWidth - 316, height: 20 }).appendTo($glow);
                $('<div id="fx-UpperRightRounded" class="fxImgFadeUpperRight"></div>').css({ position: 'absolute', left: options.offset + 6,      top: -19, width: 300, height: 20 }).appendTo($glow);
                
            } else 
            if (options.shadow == "FadeLeft") {
                // Append smooth corners
                $('<div id="fx-UpperLeftRound" class="fxImgFadeLeftTop"></div>').css({ position: 'absolute',  left: options.offset - 21, top: 0, width: 20,             height: 300 }).appendTo($glow);
                $('<div id="fx-UpperLeftRound" class="fxImgFadeLeftMiddle"></div>').css({ position: 'absolute',  left: options.offset - 21, top: 300, width: 20,             height: baseHeight - 600 }).appendTo($glow);
                $('<div id="fx-UpperLeftRound" class="fxImgFadeLeftBottom"></div>').css({ position: 'absolute',  left: options.offset - 21, top: baseHeight - 300, width: 20,             height: 300 }).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 - 310 }).appendTo($glow);
                $('<div id="fx-AroundCorners" class="fxImgFadeLeft""></div>').css({          position: 'absolute', left: options.offset - 23, top: baseHeight - 300, width: 20, height: 300 }).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 - 310 }).appendTo($glow);
                $('<div id="fx-AroundCorners" class="fxImgFadeRight""></div>').css({         position: 'absolute', left: options.offset + baseWidth - 5,  top: baseHeight - 300, width: 20, height: 300 }).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 - 360 }).appendTo($glow);
                $('<div id="fx-AroundCornersLayered" class="fxImgFadeLeft"></div>').css({ position: 'absolute',  left: options.offset - 23, top: baseHeight - 350, width: 20,             height: 300 }).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 - 360 }).appendTo($glow);
                $('<div id="fx-AroundCornersLayered" class="fxImgFadeRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 5,      top: baseHeight - 350, width: 20, height: 300 }).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 - 305}).appendTo($glow);
                $('<div id="fx-Around" class="fxImgFadeLeft"></div>').css({ position: 'absolute',  left: options.offset - 23, top: baseHeight - 300, width: 20,             height: 300 }).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 - 305}).appendTo($glow);
                $('<div id="fx-Around" class="fxImgFadeRight"></div>').css({ position: 'absolute', left: options.offset + baseWidth - 5,      top: baseHeight - 300, width: 20, height: 300 }).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);
                

            } 
			
			// 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 == "UpperLeftRoundedLayered" ? '501' : zIndex),
				top:          position.top+"px",
				left:         position.left+"px",
				width:        baseWidth,
				height:       (options.shadow == "aroundCornersLayered" || options.shadow == "UpperLeftRoundedLayered" ? 1 : baseHeight),
				marginLeft:   $element.css("marginLeft"),
				marginRight:  $element.css("marginRight"),
				marginBottom: $element.css("marginBottom"),
				marginTop:    $element.css("marginTop")
			});
            $glow.fadeIn('fast', function(){});
//            $glow.css('display','');

		});
	};
	
})(jQuery);