Transloadit file field: possibility to remove current image

The form now displays a "remove" button using the remove glyphicon
before the "Choose File" field to let the user remove a file he
previously uploaded.

The feature would probably benefit from a bit of styling.

Note the uploaded file is not deleted from the server.

lib/jsonform.js

@@ -218,7 +218,14 @@ jsonform.fieldTemplate = function(inner) {
     '</div></div>';
 };
 
-var fileDisplayTemplate = '<% if (value.type=="image") { %><img class="jsonform-preview" id="jsonformpreview-<%= id %>" src="<%= value.url %>" /><% } else { %><a href="<%= value.url %>"><%= value.name %></a> (<%= Math.ceil(value.size/1024) %>kB)<% } %><br/>';
+var fileDisplayTemplate = '<div class="_jsonform-preview">' +
+  '<% if (value.type=="image") { %>' +
+  '<img class="jsonform-preview" id="jsonformpreview-<%= id %>" src="<%= value.url %>" />' +
+  '<% } else { %>' +
+  '<a href="<%= value.url %>"><%= value.name %></a> (<%= Math.ceil(value.size/1024) %>kB)' +
+  '<% } %>' +
+  '</div>' +
+  '<a href="#" class="btn _jsonform-delete"><i class="icon-remove" title="Remove"></i></a> ';
 
 var inputFieldTemplate = function (type) {
   return {
@@ -573,6 +580,15 @@ jsonform.elementTypes = {
         }
       });
     },
+    'onInsert': function (evt, node) {
+      $(node.el).find('a._jsonform-delete').on('click', function (evt) {
+        $(node.el).find('._jsonform-preview').remove();
+        $(node.el).find('a._jsonform-delete').remove();
+        $(node.el).find('#' + escapeSelector(node.id)).val('');
+        evt.preventDefault();
+        return false;
+      });
+    },
     'onSubmit': function (evt, elt) {
       if (elt.ownerTree._transloadit_bound) {
         return false;