(function($) {
	$.fn.filestyle = function(options) {

		var settings = {
			width: 250,
			contclass: 'inputFile',
			buttontext: 'Browse',
			buttonclass: 'button'
		};

		if(options) {
			$.extend(settings, options);
		};

		return this.each(function() {

			var self = this;
			var wrapper = $("<div>")
						.css({
							"height": settings.imageheight + "px",
							"position": "relative",
							"float": "left",
							"text-align":"center",
							"margin-left":"10px"
						});

			var filename = $('<input class="file">')
							.addClass("text")
							.css({
								"width": settings.width + "px",
								"float":"left"
							})
							.attr('readonly', 'readonly');

			$(self).wrap('<div class="' + settings.contclass + '"></div>');

			$(self).before(filename);

			$(self).wrap(wrapper);

			var fileButton = $('<a href="javascript:void(0);" class="' + settings.buttonclass + '"><span>' + settings.buttontext + '</span></a>');

			$(self).before(fileButton)
				.hover(function() {
						fileButton.addClass("sfhover")
					},function(){
						fileButton.removeClass("sfhover")
			 	})
				.css({
					"position": "absolute",
					"height": settings.imageheight + "px",
					"cursor": "pointer",
					"right": 0,
					"margin": 0,
					"opacity": "0.0"
				})
				.bind("change", function() {
					filename.val( $(self).val() );
				})
		})
	}
})(jQuery);

