ShowEasyFrontEnd/FrontEnd/utils/image.js

export function convertImgToBase64(url) {
  var canvas = document.createElement('canvas');
  var ctx = canvas.getContext('2d');
  // img = document.createElement('img'),
  var img = new Image();
  img.src = url;
  canvas.height = img.height;
  canvas.width = img.width;
  var dataURL = canvas.toDataURL('image/jpeg');
  alert(dataURL);
  canvas = null;
  return dataURL;
}

export function getDataUri(url, cb) {
  var image = new Image();
  image.setAttribute('crossOrigin', 'anonymous'); //getting images from external domain

  image.onload = function () {
    var canvas = document.createElement('canvas');
    canvas.width = this.naturalWidth;
    canvas.height = this.naturalHeight;

    //next three lines for white background in case png has a transparent background
    var ctx = canvas.getContext('2d');
    ctx.fillStyle = '#fff'; /// set white fill style
    ctx.fillRect(0, 0, canvas.width, canvas.height);

    canvas.getContext('2d').drawImage(this, 0, 0);

    cb(canvas.toDataURL('image/jpeg'));
  };

  image.src = url;
}

// export function toDataURL(url, callback) {
//   var XMLHttpRequest = require('xhr2');
//   var xhr = new XMLHttpRequest();
//   xhr.onload = function () {
//     var reader = new FileReader();
//     reader.onloadend = function () {
//       callback(reader.result);
//     };
//     reader.readAsDataURL(xhr.response);
//   };
//   xhr.open("GET", url);
//   xhr.responseType = "blob";
//   xhr.send();
// }