summer note attachemt upload

gistfile1.txt

 def attachment_upload
    attachment = Attachment.create(attachment_url: params['file'])
    respond_to do |format|
      format.json { render json: {url: attachment.attachment_url, id: attachment.id} }
    end
  end
  
  def self.remove_attachment(deleted_image_ids)
    attachment_ids = JSON.parse(deleted_image_ids)
    attachments = Attachment.where(id: attachment_ids)
    attachments.destroy_all if attachments.present?
  end
  
  
  
  
  
  $(document).ready(function() {
  initialImagesElements = {}
 ,initialImagesArray = []
  //upload image in description
	$('#email_description').summernote({
		height: 300,
		onImageUpload: function(files, editor, welEditable) {
      for (var i = files.length - 1; i >= 0; i--) {
        sendFile(files[i], this);
      }
    }
  });
  //create record for attachement
  function sendFile(file, el) {
    data = new FormData();
    data.append("file", file);
    $.ajax({
        type: "POST",
        url: "/compose_mails/attachment_upload",
        data: data,
        cache: false,
        contentType: false,
        processData: false,
        dataType: 'json',
        success: function(response) {
          $(el).summernote('editor.insertImage', response.url.attachment_url.url, response.id);                 
        },
        error : function(error) {
          alert('error');
        },
        complete : function(response) {
          initialImagesArray.push(response.responseJSON.id);
          $('#attachmentId').val(JSON.stringify(initialImagesArray));
        }
    });
  }


  /*Generate initial image array containing attachment ID function  */
  function imagesBeforeSubmission() {
    initialImagesElements = $($('.note-editable').html()).find("img");
    initialImagesElements.each(function() {
      initialImagesArray.push($(this).data("id"));
    });  
  }

  imagesBeforeSubmission();

  $('.btn_send_email').click(function(e){
    var jForm = $(this)[0].form
      , finalImagesElements = $($('.note-editable').html()).find("img")
      , finalImagesArray = []
      , deletedImagesArray = []
      ;
                                        
    e.preventDefault();
    //$("div.note-editable").find("div.JCLRgrips").remove();
    //$('.report_description_input').val($('.report_description').code());

    finalImagesElements.each(function() {
      finalImagesArray.push($(this).data("id"));
    });

    function difference(a1, a2) {
      var result = [];
      for (var i = 0; i < a1.length; i++) {
        if (a2.indexOf(a1[i]) === -1) {
          result.push(a1[i]);
        }
      }
      return result;
    };

    //delete the images from backend when remove 
    deletedImagesArray = difference(initialImagesArray,finalImagesArray);
    $("#attachmentIds").val(JSON.stringify(deletedImagesArray));
    $(jForm).submit();
  });