Image Preview For Contact Form

I wanted to share this jQuery snippet of showing a preview of an image that has been selected to be uploaded. This shows the image the moment it has been selected.

Code below is for Contact Form 7 :

HTML code:

[file* Photo id:upload filetypes:jpg|png|gif|bmp] //File upload shortcode

<div id="preview"></div> //Div whose background will be set to the image selected through the above file upload

jQuery code:

$(function() {
    $("#upload").on("change", function()
    {
        if($("#upload").val()=='') {
                 $("#preview").css("background-image", "url(default.png)"); //If the file upload value is empty, show a default background for div
        }
        else {
        $("#preview").css("background-image", "url(load.gif)");//Show loading icon
        var files = !!this.files ? this.files : [];
        if (!files.length || !window.FileReader) return;
        if (/^image/.test( files[0].type)){
            var reader = new FileReader();
            reader.readAsDataURL(files[0]);
            reader.onloadend = function(){
                var xn=this.result;
                $("#preview").css("background-image", "url("+xn+")");//Set the background of the div to the file selected.
            }
        }
        }
    });
});
</script>

CSS code:

#preview {
	background: url("default.png");
	width: 200px;
	height: 200px;
	background-position: center center;
	background-size: contain;
	background-repeat: no-repeat;
}

Just wanted to know if someone with the proper knowledge could create a plugin that could actually create a shortcode for Contact Form 7 (and options for other similar plugins) that would create a div which accepts the values ‘height’, ‘width’, ‘name of file upload shortcode’, ‘default background (optional), ‘animated loading image (optional)’. It could use the jQuery code I posted above (it’s really simple and works well) and would be really useful for all.

I could try to make a plugin myself but I don’t have enough knowledge to do it. If you wish, you could even teach me all the basics needed to make such a plugin and then I could develop and release it if you guys support it. If not, I would support the idea that someone makes a really good plugin with this functionality.

If you wish to know why I want a plugin when I already have the code in my form, it’s because one of my forms has a LOT of preview fields and the jQuery would make it all confusing (I already have a HUGE amount of jQuery code in that form). So a plugin which will provide just a shortcode would be a sort of blessing for me.