Creative sdk: How to get Base64 image data after save

Question

How I can get the base64 format while saving the image?

onSave: function(imageID, newURL) {
   originalImage.src = newURL;
   featherEditor.close();
}

Answer 1

Here is some code I used in an Angular 1 / Cordova (Phonegap) app, obviously you might want to strip out the promises, and its also not in any way refactored (just two copy/paste jobs) but does the the treat. You also need the cordova file plugin installed.

function _launchEditor(imageUrl, options) {
    /* 2.a) Prep work for calling `.edit()` */
    var deferred = $q.defer();

    function success(newUrl) {
      /**
       * This function will handle the conversion from a file to base64 format
       *
       * @path string
       * @callback function receives as first parameter the content of the image
       */
      function getFileContentAsBase64(path, callback) {
        window.resolveLocalFileSystemURL(path, gotFile, error);

        function gotFile(fileEntry) {
          fileEntry.file(function (file) {
            var reader = new FileReader();
            reader.onloadend = function (e) {
              var content = this.result;
              callback(content);
            };
            // The most important point, use the readAsDatURL Method from the file plugin
            reader.readAsDataURL(file);
          });
        }
      }

      getFileContentAsBase64(newUrl, function (base64Image) {
        //window.open(base64Image);
        // Then you'll be able to handle the myimage.png file as base64
        deferred.resolve({
          data: base64Image,
          url: newUrl
        })
      });
    }

    function error(error) {
      deferred.reject(error);
    }

    if (!options) {
      options = {
        outputType: CSDKImageEditor.OutputType.JPEG,
        tools: [
          CSDKImageEditor.ToolType.CROP,
          CSDKImageEditor.ToolType.ORIENTATION,
          CSDKImageEditor.ToolType.TEXT,
          CSDKImageEditor.ToolType.DRAW
        ],
        quality: 50
      }
    }

    /* 2.b) Launch the Image Editor */
    CSDKImageEditor.edit(success, error, imageUrl, options);
    return deferred.promise;
  }

Then just call with

_launchEditor(<ImageUrl>)
      .then(function(data){
         //data.url = creativesdk saved image url
         //data.data = base64 image data
       })