SummerNote(With file in the text, content [Images or Videos])

SummerNote(With file in the text, content [Images or Videos])

<link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.7/summernote.css" rel="stylesheet">
<div class="summernote"></div>
<textarea name="summerNoteContent" id="resultSummerNote" required=""></textarea>

<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.7/summernote.js"></script>
<script
  src="https://code.jquery.com/jquery-2.2.4.min.js"
  integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
  crossorigin="anonymous"></script>
<script>
  jQuery(document).ready(function(){
    $('.summernote').summernote({
          height: 500, 
          minHeight: null,             // set minimum height of editor
          maxHeight: 250, 
          focus: false,
          onImageUpload: function(files, editor, welEditable) {
              sendFile(files[0], editor, welEditable, 'summernote');
          }
      });
      $('progress').hide();
      
      $('.note-editable').attr('id','contenuSUMMER');
      document.getElementById("contenuSUMMER").addEventListener("input", function() {
          $('#resultSummerNote').val(this.innerHTML);
      }, false);
      
  function sendFile(file, editor, welEditable, cible) {
      data = new FormData();
      data.append("file", file);
      $('progress').show();
      $.ajax({
          data: data,
          type: 'POST',
          xhr: function() {
              var myXhr = $.ajaxSettings.xhr();
              if (myXhr.upload) myXhr.upload.addEventListener('progress',progressHandlingFunction, false);
              return myXhr;
          },
          url: 'uploadLangueImages.php',
          cache: false,
          contentType: false,
          processData: false,
          success: function(url) {
              alert();
              $('progress').hide();
              var image = $('<img>').attr('src', 'http://' + url);
              $('.'+cible).summernote("insertNode", image[0]);
          }
      });
  }

  function progressHandlingFunction(e){
      if(e.lengthComputable){
          $('progress').attr({value:e.loaded, max:e.total});
          // reset progress on complete
          if (e.loaded == e.total) {
              $('progress').attr('value','0.0');
          }
      }
  }

  });
</script>