Search code examples
javascriptfirefox-os

Save image file in sdcard in firefox OS


I am trying to save an image in sdcard. I am following this documentation.

$('.btnSave').on('click', function () {

        var imageRawData = canvas.toDataURL("image/png") ;
        var sdcard = navigator.getDeviceStorage("sdcard");
        var file = new Blob([imageRawData], { type: "image/png" });
        var request = sdcard.addNamed(file, "FilertedImage.png");

                request.onsuccess = function () {
                var name = this.result;
                console.log('File "' + name + '" successfully wrote on the sdcard storage area');

                }
                request.onerror = function (e) {
                console.log('Unable to write the file: ' + e.target.error.name);

                }
    }); 

In the documentation I found that "pictures only accepts Blob with a valid image mime type". So how can I convert imageRawData to valid image mime type using javascript.


Solution

  • I have done it like the following - Saves and then shares:

     function saveAndSend(blob) {
         var sdcard = navigator.getDeviceStorage("sdcard");
         var request = sdcard.addNamed(blob, "test/mycanvas.png");
    
         //could just share the blob instead of saving
         request.onsuccess = function () {
             var sharingImage = new MozActivity({
                 name: "share",
                 data: {
                     type: "image/*",
                     number: 1,
                     blobs: [blob],
                     filenames: ["mycanvas.png"],
                     filepaths: ["test/mycanvas.png"]
                 }
             });
         }
    
         // An error could occur if a file with the same name already exist
         request.onerror = function () {
             alert('Unable to write the file: ' + this.error.name);
         }
    
     }
    
    
     var cnv = document.getElementById('myCanvas');
     cnv.toBlob(function (blob) {
    
         //var sdcard = navigator.getDeviceStorage("pictures");
         var sdcard = navigator.getDeviceStorage("sdcard");
         var request = sdcard.delete("test/mycanvas.png");
         //try to delete in case it exists
         request.onsuccess = function () {
             saveAndSend(blob);
         }
    
         request.onerror = function () {
             saveAndSend(blob);
         }
    
    
     });