//
// Add a class of "ds" to any div you want to have a drop shadow
// Written by James Player 2009
//

(function($) {
    $.fn.drop_shadow = function(options) {
        
        var opts = $.extend({}, $.fn.drop_shadow.defaults, options);
        var i = 0;
        
        $(this).each(function() {
        
            var path_to_images = opts.path_to_images;
            var shadow_size = new Array();
            shadow_size["top"] = opts.shadow_size_top;
            shadow_size["right"] = opts.shadow_size_right;
            shadow_size["bottom"] = opts.shadow_size_bottom;
            shadow_size["left"] = opts.shadow_size_left;
            var corner_side_length = opts.corner_size;
            var border_width = new Array();
            var offset = new Array();
            var start_point = new Array();
            
            // Are we dealing with a self closing tag?
            var self_closer = false;
            if(/^(?:area|br|col|embed|hr|img|input|link|meta|param)$/i.test(this.tagName)) {
                self_closer = true;
            }
            
            for(var key in shadow_size){
                // Get border widths
                border_width[key] = $(this).css("border-"+key+"-width").replace("px", "");
                if(!isInteger(border_width[key])){
                    border_width[key] = 0;
                }
                
                // Get offset (absolute positions of shadows)
                offset[key] = parseInt(shadow_size[key]) + parseInt(border_width[key]);
                
                // Get start point for side images
                start_point[key] = corner_side_length - offset[key];
                
                offset[key] = parseInt("-" + offset[key]);
            }
            
            // Get side height and width
            var box_width = $(this).outerWidth();
            var box_height = $(this).outerHeight();
            
            var side_length = new Array();
            side_length["width"] = box_width - start_point["right"] - start_point["left"] - border_width["left"] - border_width["right"];
            side_length["height"] = box_height - start_point["top"] - start_point["bottom"] - border_width["top"] - border_width["bottom"];
            
            if(self_closer){
            
                // adjust positions of drop shadow images to cater for margins on the self closing tag
                var margin = new Array;
                margin['top'] = $(this).css("margin-top").replace("px", "");
                margin['right'] = $(this).css("margin-right").replace("px", "");
                margin['bottom'] = $(this).css("margin-bottom").replace("px", "");
                margin['left'] = $(this).css("margin-left").replace("px", "");
                
                offset['top'] = parseInt(offset['top']) + parseInt(margin['top']);
                offset['right'] = parseInt(offset['right']) + parseInt(margin['right']);
                offset['bottom'] = parseInt(offset['bottom']) + parseInt(margin['bottom']);
                offset['left'] = parseInt(offset['left']) + parseInt(margin['left']);
                
                start_point['top'] = parseInt(start_point['top']) + parseInt(margin['top']);
                start_point['right'] = parseInt(start_point['right']) + parseInt(margin['right']);
                start_point['bottom'] = parseInt(start_point['bottom']) + parseInt(margin['bottom']);
                start_point['left'] = parseInt(start_point['left']) + parseInt(margin['left']);
                
                $(this)
                    .wrap("<div style='position: relative; display: inline-block; zoom: 1; *display: inline;'></div>")
                    .siblings("img.shadow")
                    .remove()
                    .end()
                    .after("<img src='" + path_to_images + "/ds-top-left.png' class='shadow' style='width: "+corner_side_length+"px; height: "+corner_side_length+"px; position: absolute; top: "+offset["top"]+"px; left: "+offset["left"]+"px; margin: 0; padding: 0;' />")
                    .after("<img src='" + path_to_images + "/ds-top.png' class='shadow' style='height: "+shadow_size["top"]+"px; width: "+side_length["width"]+"px; position: absolute; top: "+offset["top"]+"px; left: "+start_point["left"]+"px; margin: 0; padding: 0;' />")
                    .after("<img src='" + path_to_images + "/ds-top-right.png' class='shadow' style='width: "+corner_side_length+"px; height: "+corner_side_length+"px; position: absolute; top: "+offset["top"]+"px; right: "+offset["right"]+"px; margin: 0; padding: 0;' />")
                    .after("<img src='" + path_to_images + "/ds-right.png' class='shadow' style='width: "+shadow_size["right"]+"px; height: "+side_length["height"]+"px; position: absolute; top: "+start_point["top"]+"px; right: "+offset["right"]+"px; margin: 0; padding: 0;' />")
                    .after("<img src='" + path_to_images + "/ds-bottom-right.png' class='shadow' style='width: "+corner_side_length+"px; height: "+corner_side_length+"px; position: absolute; bottom: "+offset["bottom"]+"px; right: "+offset["right"]+"px; margin: 0; padding: 0;' />")
                    .after("<img src='" + path_to_images + "/ds-bottom.png' class='shadow' style='height: "+shadow_size["bottom"]+"px; width: "+side_length["width"]+"px; position: absolute; left: "+start_point["left"]+"px; bottom: "+offset["bottom"]+"px; margin: 0; padding: 0;' />")
                    .after("<img src='" + path_to_images + "/ds-bottom-left.png' class='shadow' style='width: "+corner_side_length+"px; height: "+corner_side_length+"px; position: absolute; bottom: "+offset["bottom"]+"px; left: "+offset["left"]+"px; margin: 0; padding: 0;' />")
                    .after("<img src='" + path_to_images + "/ds-left.png' class='shadow' style='width: "+shadow_size["left"]+"px; height: "+side_length["height"]+"px; position: absolute; top: "+start_point["top"]+"px; left: "+offset["left"]+"px; margin: 0; padding: 0;' />");
                    
            } else {
        
                $(this)
                    //.css("position", "relative")
                    .children("img.shadow")
                    .remove()
                    .end()
                    .append("<img src='" + path_to_images + "/ds-top-left.png' class='shadow' style='width: "+corner_side_length+"px; height: "+corner_side_length+"px; position: absolute; top: "+offset["top"]+"px; left: "+offset["left"]+"px; margin: 0; padding: 0;' />")
                    .append("<img src='" + path_to_images + "/ds-top.png' class='shadow' style='height: "+shadow_size["top"]+"px; width: "+side_length["width"]+"px; position: absolute; top: "+offset["top"]+"px; left: "+start_point["left"]+"px; margin: 0; padding: 0;' />")
                    .append("<img src='" + path_to_images + "/ds-top-right.png' class='shadow' style='width: "+corner_side_length+"px; height: "+corner_side_length+"px; position: absolute; top: "+offset["top"]+"px; right: "+offset["right"]+"px; margin: 0; padding: 0;' />")
                    .append("<img src='" + path_to_images + "/ds-right.png' class='shadow' style='width: "+shadow_size["right"]+"px; height: "+side_length["height"]+"px; position: absolute; top: "+start_point["top"]+"px; right: "+offset["right"]+"px; margin: 0; padding: 0;' />")
                    .append("<img src='" + path_to_images + "/ds-bottom-right.png' class='shadow' style='width: "+corner_side_length+"px; height: "+corner_side_length+"px; position: absolute; bottom: "+offset["bottom"]+"px; right: "+offset["right"]+"px; margin: 0; padding: 0;' />")
                    .append("<img src='" + path_to_images + "/ds-bottom.png' class='shadow' style='height: "+shadow_size["bottom"]+"px; width: "+side_length["width"]+"px; position: absolute; left: "+start_point["left"]+"px; bottom: "+offset["bottom"]+"px; margin: 0; padding: 0;' />")
                    .append("<img src='" + path_to_images + "/ds-bottom-left.png' class='shadow' style='width: "+corner_side_length+"px; height: "+corner_side_length+"px; position: absolute; bottom: "+offset["bottom"]+"px; left: "+offset["left"]+"px; margin: 0; padding: 0;' />")
                    .append("<img src='" + path_to_images + "/ds-left.png' class='shadow' style='width: "+shadow_size["left"]+"px; height: "+side_length["height"]+"px; position: absolute; top: "+start_point["top"]+"px; left: "+offset["left"]+"px; margin: 0; padding: 0;' />");
                    
            }
            i++;
        });
        
    }
    
    $.fn.drop_shadow.defaults = {
        path_to_images: "/js/jquery-drop-shadow/images",   // String. Path to images folder where your drop shadow images will be kept
        shadow_size_top: 5,         // Integer: Height of the top shadow image
        shadow_size_right: 7,       // Integer: Width of the right shadow image
        shadow_size_bottom: 9,      // Integer: Height of the bottom shadow image
        shadow_size_left: 7,        // Integer: Width of the left shadow image
        corner_size: 25             // Integer: Height or width of the corner squares (since they're squares height and width should be the same!)
    };
    
    function isInteger(s) { // THANKS http://surf11.com/entry/157/javascript-isinteger-function
        return (s.toString().search(/^-?[0-9]+$/) == 0);
    }

    
})(jQuery);