Ya vimos que la beta 1 de Firefox 3.6 nos ofrecía una buena remesa de nuevos estándares y nuevas implementaciones que harán más interesante la experiencia del usuario frente al navegador. Para ilustrar una de ellas, Mozhacks ha implementado un pequeño ejemplo en el que podremos arrastrar imágenes desde nuestro escritorio diréctamente a nuestro navegador. Todo ello sobre Mozilla Firefox 3.6 Beta X, aprovechándose de la FileAPI (que ya hemos visto antes), el Drag & Drop externo y el archiconocido XMLHttpRequest
(objeto culpable del Ajax).
Automáticamente al arrastrar las imágenes (permite multiselección) aparecerán en la página y así podremos visualizar las imágenes que vamos a subir antes de realmente subirlas. Esto es posible gracias a la nueva API de Ficheros que como vemos más abajo, es muy sencilla de usar:
// Leemos fichero binario
var reader = new FileReader();
reader.onload = function(e) {
var bin = e.target.result;
// bin is the binaryString
};
reader.readAsBinaryString(file);
// Subimos fichero como binario
var xhr = new XMLHttpRequest();
xhr.open("POST", "upload.php");
xhr.overrideMimeType('text/plain; charset=x-user-defined-binary');
xhr.sendAsBinary(bin);
Ver el código, no tiene desperdicio.
6 comentarios, 4 referencias
+
#