/*
* Style File - jQuery plugin for styling file input elements
*
* Copyright (c) 2007-2009 Mika Tuupola
*
* Licensed under the MIT license:
* http://www.opensource.org/licenses/mit-license.php
*
* Based on work by Shaun Inman
* http://www.shauninman.com/archive/2007/09/10/styling_file_inputs_with_css_and_the_dom
*
*/
 
(function($) {
    
    $.fn.filestyle = function(options) {
                
        /* TODO: This should not override CSS. */
        var settings = {
            width : 250
        };
                
        if(options) {
            $.extend(settings, options);
        };
                        
        return this.each(function() {
            
            var self = this;
            if(settings.image)
            {
	            var wrapper = $("<div>")
	                            .css({
	                                "width": settings.imagewidth + "px",
	                                "height": settings.imageheight + "px",
	                                "background": "url(" + settings.image + ") 0 0 no-repeat",
	                                "background-position": "right",
	                                "display": "inline",
	                                "float": "right",
	                                "cursor": "pointer",
	                                "overflow": "hidden"
	                            });
            } else {
            	// click doent work, WTF?
            	 var wrapper = $("<div>")
				                 .css({
				                     "width": settings.buttonwidth + "px",
				                     "height": settings.buttonheight + "px",
				                     "display": "inline",
				                     "position": "absolute",
				                     "padding": "1px 5px 0px 5px",
				                     "overflow": "hidden"
				                 }).addClass(settings.buttonclass).html(settings.buttontext);
            }
                            
            var filename = $('<input class="file">')
            				 .attr('id', settings.id)
                             .addClass($(self).attr("class"))
                             .css({
                                 "display": "inline",
                                 "width": settings.width + "px"
                             });
 
            $(self).before(filename);
            $(self).wrap(wrapper);
 
            $(self).css({
                        "position": "relative",
                        "height": settings.imageheight + "px",
                        "width": settings.width + "px",
                        "display": "inline",
                        "cursor": "pointer",
                        "opacity": "0.0"
                    });
 
            if ($.browser.mozilla) {
                if (/Win/.test(navigator.platform)) {
                    $(self).css("margin-left", "-142px");
                } else {
                    $(self).css("margin-left", "-168px");
                };
            } else {
                $(self).css("margin-left", settings.imagewidth - settings.width + "px");
            };
 
            $(self).bind("change", function() {
                filename.val($(self).val());
            });
      
        });
        
 
    };
    
})(jQuery);