$.fn.inputToButton = function() {
  return $(this).each(function(){
    	if($(this).is('[type=button],[type=submit],[type=reset],[type=image]')){
	    	var button = $('<button type="'+ $(this).attr('type') +'">'+ $(this).val() +'</button>');
	    	button.attr({
	    		'id': $(this).attr('id'),
	    		'name': $(this).attr('name'),
	    		'class': $(this).attr('class'),
	    		'value': $(this).attr('value'),
	    		'title': $(this).attr('title')
	    	})
	    	if ($(this).data('events')) {
	    		$.each($(this).data('events'), function(eventname, bindings){ $.each(bindings, function(){ button.bind(eventname, this); }); });    	
	    	}; 

	    	//get hover classes by adding classes with -hover	
	    	var hoverClasses = $(this).attr('class').split(' ');
	    	$.each(hoverClasses,function(i){ hoverClasses[i]+='-hover'; });
	    	hoverClasses = hoverClasses.join(' ');
	    	
	    	button.hover(
    			function(){ $(this).addClass(hoverClasses); },
    			function(){ $(this).removeClass(hoverClasses); }
    		);
    		
    		$(this).replaceWith(button);
	    }	
    });
};

$.fn.customFileInput = function(){
	return $(this).each(function(){
	//apply events and styles for file input element
	var fileInput = $(this)
		.addClass('custom-file-input') //add class for CSS
		.mouseover(function(){ upload.addClass('custom-file-hover'); })
		.mouseout(function(){ upload.removeClass('custom-file-hover'); })
		.focus(function(){
			upload.addClass('custom-file-focus'); 
			fileInput.data('val', fileInput.val());
		})
		.blur(function(){ 
			upload.removeClass('custom-file-focus');
			$(this).trigger('checkChange');
		 })
		 .bind('disable',function(){
		 	fileInput.attr('disabled',true);
			upload.addClass('custom-file-disabled');
		})
		.bind('enable',function(){
			fileInput.removeAttr('disabled');
			upload.removeClass('custom-file-disabled');
		})
		.bind('checkChange', function(){
			if(fileInput.val() && fileInput.val() != fileInput.data('val')){
				fileInput.trigger('change');
			}
		})
		.bind('change',function(){
			//get file name
			var fileName = $(this).val().split(/\\/).pop();
			//get file extension
			var fileExt = 'custom-file-ext-' + fileName.split('.').pop().toLowerCase();
			//update the feedback
			uploadFeedback
				.text(fileName) //set feedback text to filename
				.removeClass(uploadFeedback.data('fileExt') || '') //remove any existing file extension class
				.addClass(fileExt) //add file extension class
				.data('fileExt', fileExt) //store file extension for class removal on next change
				.addClass('custom-file-feedback-populated'); //add class to show populated state
			//change text of button	
			uploadButton.text('Change');	
		})
		.click(function(){ //for IE and Opera, make sure change fires after choosing a file, using an async callback
			fileInput.data('val', fileInput.val());
			setTimeout(function(){
				fileInput.trigger('checkChange');
			},100);
		});
		
	//create custom control container
	var upload = $('<div class="custom-file"></div>');
	//create custom control button
	var uploadButton = $('<span class="custom-file-button" aria-hidden="true">Browse</span>').appendTo(upload);
	//create custom control feedback
	var uploadFeedback = $('<span class="custom-file-feedback" aria-hidden="true">No file selected...</span>').appendTo(upload);
	
	//match disabled state
	if(fileInput.is('[disabled]')){
		fileInput.trigger('disable');
	}
		
	
	//on mousemove, keep file input under the cursor to steal click
	upload
		.mousemove(function(e){
			fileInput.css({
				'left': e.pageX - upload.offset().left - fileInput.outerWidth() + 20, //position right side 20px right of cursor X)
				'top': e.pageY - upload.offset().top - $(window).scrollTop() - 3
			});	
		})
		.insertAfter(fileInput); //insert after the input
	
	fileInput.appendTo(upload);
		
	});
};