Summernote: Responsive Image width / size using onimageupload?

[juliomac]

I know we already have the issues here and here . But both give users the task to change image to percentage width.

If they do not act on this, the corresponding image will be displayed with fixed width as shown below.
<img src="data:image/jpeg;base64,/9j/4Qk... ...sv6+zE//Z" data-filename="image.jpg" **style="width: 768px;">**

I want all images to be styled like below:
<img src="data:image/jpeg;base64,/9j/4Qk... ...sv6+zE//Z" data-filename="image.jpg" **style="width: 100%;">**

Is it possible to configure Style permanently without user intervention? Maybe using imageupload?

[juliomac]

I have got a solution for this problem inspired by answer of @easylogic on issue#1069.

I have used the following code:

       onImageUpload : function(files) {
      if (!files.length) return;
      var file = files[0];
      // create FileReader
      var reader  = new FileReader();
      reader.onloadend = function () {
          // when loaded file, img's src set datauri
          console.log("img",$("<img>"));
          var img = $("<img>").attr({src: reader.result, width: "100%"}); // << Add here img attributes !
          console.log("var img", img);
          $(TariffHTMLId).summernote("insertNode", img[0]);
      }

      if (file) {
        // convert fileObject to datauri
        reader.readAsDataURL(file);
      }
  }