/* JavaScript Document/*
 * Style File - jQuery plugin for styling file input elements
 *  
 * Copyright (c) 2007-2008 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
 *
 * Revision: jQueryId: jquery.filestyle.js 303 2008-01-30 13:53:24Z tuupola jQuery
 *
 */

(function(jQuery) {
    jQuery.fn.filestyle = function(options) {
        /* TODO: This should not override CSS. */
        var settings = {
            width : 200
        };
        if(options) {
            jQuery.extend(settings, options);
        };
        return this.each(function() {
            var self = this;
            var wrapper = jQuery("<div>")
                            .css({
                                "width": settings.imagewidth + "px",
                                "height": settings.imageheight + "px",
                                "background": "url(" + settings.image + ") 0 0 no-repeat",
                                "background-position": "left",
                                "display": "inline",
                                "position": "absolute",
								//"left" : "178px",
                                "overflow": "hidden"
                            });
                            
            var filename = jQuery('<input class="file">')
                             .addClass(jQuery(self).attr("class"))
                             .css({
                                 "display": "inline",
                                 "width": settings.width + "px",
								 "height": "18px"
                             });
            jQuery(self).before(filename);
            jQuery(self).wrap(wrapper);
            jQuery(self).css({
                        "position": "relative",
                        "height": settings.imageheight + "px",
                        "width": settings.width + "px",
                        "display": "inline",
                        "cursor": "pointer",
                        "opacity": "0.0"
                    });
            if (jQuery.browser.mozilla) {
                if (/Win/.test(navigator.platform)) {
                    jQuery(self).css("margin-left", "-142px");
                } else {
                    jQuery(self).css("margin-left", "-168px");
                };
            } else {
                jQuery(self).css("margin-left", settings.imagewidth - settings.width + "px");
            };
            jQuery(self).bind("change", function() {
                filename.val(jQuery(self).val());
            });
        });
    };
    
})(jQuery);