Escribir binarios - CGastrell/phonegap GitHub Wiki

Referencia:

En el ultimo ejercicio almacenamos nuestras fotos en localStorage. No es la solucion ideal, asi que ahora podriamos intentar escribir nuestros JPG a partir del archivo codificado en base64. Para esto vamos a utilizar la File API pero primero debemos convertir estos archivos.

base64 a Blob

Para poder escribir los archivos ya vimos el caso de writeTextFile.

writeTextFile tiene una simplicidad implicita: cuando guardamos texto no necesitamos generar un Blob.

En la referencia puse un link sobre como pasar de base64 a Blob. Esta es en definitiva la funcion que vamos a usar:

function b64toBlob(b64Data, contentType, sliceSize) {
  contentType = contentType || '';
  sliceSize = sliceSize || 512;

  var byteCharacters = atob(b64Data);
  var byteArrays = [];

  for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
    var slice = byteCharacters.slice(offset, offset + sliceSize);

    var byteNumbers = new Array(slice.length);
    for (var i = 0; i < slice.length; i++) {
        byteNumbers[i] = slice.charCodeAt(i);
    }

    var byteArray = new Uint8Array(byteNumbers);

    byteArrays.push(byteArray);
  }

  var blob = new Blob(byteArrays, {type: contentType});
  return blob;
}

writeJpeg(fileName, base64content, callback)

En nuestro fileApi, agregamos este metodo:

  writeJpeg: function(fileName, base64content, callback) {
    var onFile = function(fileEntry) {
      fileEntry.createWriter(function(fileWriter){
        var blob = b64toBlob(base64content,'image/jpeg');
        fileWriter.onwriteend = function(){
          callback && callback(fileEntry.nativeURL);
        }
        fileWriter.write(blob);
      }, fileApi.onError);
    }
    fileApi.dir.getFile(fileName, {create: true}, onFile, fileApi.onError);
  }

Si lo analizamos es muy similar a writeTextFile, incluso en sus argumentos, la diferencia es que en lugar de pasarle texto legible como contenido, pasamos el archivo en base64.

Una vez que llegamos a la instancia del FileWriter, primero convertimos el contenido:

var blob = b64toBlob(base64content,'image/jpeg');

y cuando termina de escribir (evento onwriteend) ejecutamos el callback pasandole la ubicacion del archivo.

callback && callback(fileEntry.nativeURL);

Galeria

Por ultimo, restaria agregar esta funcionalidad en la galeria :)