Mi primera app --> DUDA BLOB


(system) #1

Buenos días,

estoy realizando mi primera aplicación, primero os la describo un poco y luego os indico mi problema.

Estoy invocando a la cámara para poder hacer cosas con las fotos mediante Web Activities. El caso es que cuando elijo una foto dentro del menu que me muestra la Web Activity (Wallpapers, Galery, Camera) me la muestra y me da la opción de recortarla (excepto la de los wallpapers que sólo me deja visualizarla, viene así por defecto en la Web Activity).

El caso es que me muestra la imagen y yo querría ponerle dos opciones a ésta, guardarla o eliminarla. He creado unos botones en los que llamo a las funciones, y no me hacen nada, salvo el de eliminar que me hace el .onerror porque lógicamente no sabe qué imagen es la que tiene que eliminar…

En definitiva, mi problema es que creo que no indico bien que es ESA imagen la que quiero emplear (la que estoy mostrando), ¿cómo lo puedo hacer? porque he probado ya de mil manera y nada…, os dejo el fragmento de código que hace referencia a la web activity y a los dos botones, el de guardar y el de eliminar. Puede ser porque no tengo la imagen como variable global y por eso cuando hace esa funcion la “elimina”, pero es que he probado a hacerla y no llego a nada, si me pudieseis echar una mano os lo agradecería.

window.onload = function() {

if( !window.MozActivity ) {
    alert('Este medio no soporta Web Activities, por favor, emplea Firefox OS para visualizar correctamente la aplicacion. Gracias.');
    return;
}

var pickImage = document.querySelector("#pick-image");

if (pickImage) {
    pickImage.onclick = function () {
	
        var pickImageActivity = new MozActivity({
            name: "pick",
            data: {
                type: "image/png", "image/jpg", "image/jpeg"]
			}
        });

        pickImageActivity.onsuccess = function () {
           //Create the element via jQuery
		   var imageElement = $('<img id="image1" height="400" width="300">'); // Como coger tamanyo normal de la foto pero en escala reducida
		   imageElement.attr('src', window.URL.createObjectURL(this.result.blob));
		   $("#pickImage").html(imageElement);

		   //Switch to the #pageid = showImage
		   $.mobile.changePage ($("#showImage"));
        };

        pickImageActivity.onerror = function () {
            alert("Can't view the image!");
			console.log(this.result);
        };
    }
}

}();

$("#btnDelete").click(function(){
//alert(“La imagen se ha eliminado con exito”);
//parent.history.back(); // Va a la anterior pagina

var pict = navigator.getDeviceStorage('pictures');
var request = pict.delete(this.result.blob);
//var request = pict.delete("my-file.txt");

request.onsuccess = function () {
	//alert("Imagen eliminada");
	console.log("Imagen eliminada log");
}

request.onerror = function () {
	//alert("No se puede borrar el fichero: " + this.error);
	console.log("No se puede borrar el fichero log: " + this.error);
}

});

$("#btnSave").click(function(){
//alert(“La imagen se ha almacenado en la galeria con exito”);
//parent.history.back(); // Va a la anterior pagina

var pict = navigator.getDeviceStorage('pictures');
var file = this.result.blob;
//var file   = new Blob("Este es un archivo de texto."], {type: "text/html"}); // Yo quiero que sea tipo imagen --> "image/png"
var request = pict.add(file);
//var request = pict.addNamed(file, "mi-archivo.txt");

if (file != null) {
	request.onsuccess = function () {
	var name = this.result.name;
	console.log("El archivo " + name + " se escribio correctamente en el area de almacenamiento");
	//alert("El archivo " + name + " se escribio correctamente en el area de almacenamiento");
	this.done = false;
	}
	
	// Un error suele producirse si un archivo con el mismo nombre ya existe
	request.onerror = function () {
		console.warn('No se puede escribir el archivo: ' + this.error);
		//alert("No se puede escribir el archivo: " + this.error);
	}
}
else {
	this.done = true;
}

if (!this.done) {
	this.continue();
}

});

Un saludo y gracias. :slight_smile:


Verónica Román López


(system) #2

Hola??

Hay alguien ahí???

Nadie sabe responder cómo se puede almacenar o eliminar la imagen que estoy visualizando mediante Web Activities (blob)?

Sigo sin encontrar la solución, por favor ayúdenme,


(system) #3

Hola Veronica, te contesto en el email y aqui por si le sirve a mas gente:

He mirado tu app a ver si encuentro cual es el problema que tienes.

Me parece que creo que se lo que pasa… y es que a DeviceStorage.delete le tienes que pasar un nombre de fichero (el de la imagen que quieres borrar), pero tu no sabes como se llama la imagen porque la has obtenido con una WebActivity, que solo te ha devuelto el blob (es decir, los contenidos de la imagen en si).

developer.mozilla.org/en-US/doc … age.delete

Para borrar una imagen tendrias que obtener de alguna forma los nombres de las imagenes primero, por ejemplo con enumerate, luego mostrar sus miniaturas, dejarle al usuario que vea la imagen antes de borrar, y dado el caso, si clica en borrar tu ahi ya sabes como se llama la imagen y puedes llamar a delete con ese nombre de fichero.

No se si te ha quedado claro…?

Creo que de todas formas tu interfaz tal y como esta ahora necesita mas trabajo, me explico: estaba probando la app en el simulador (usando el App manager) y ha sacado imagenes que tengo en el ordenador. Entonces he elegida una y… me ha dado miedo pulsar el boton de eliminar porque no sabia que imagen iba a eliminar. De hecho algunas imagenes no se de donde las ha sacado. Al usar una web activity el usuario no ve exactamente de donde salen las imagenes, solo ve las imagenes en si. No se si me explico? Es un poco confuso.