Seleccionar varias fotos desde la galería de imágenes de un dispositivo usando PhoneGap

Question

Pude crear una aplicación de prueba basada en el ejemplo completo de camera.getPicture en la documentación de PhoneGap. Me permite tomar una foto o recuperar una foto de la galería y colocarla en un div.

Sin embargo, deseo poder seleccionar varias imágenes de la galería y colocar cada una en su propia div. ¿Alguien puede señalarme en la dirección correcta para aprender a lograr esto?

Gracias.

Aquí está el código JavaScript que estoy usando:

var pictureSource; // picture source 
var destinationType; // sets the format of returned value 

// Wait for PhoneGap to connect with the device 
document.addEventListener("deviceready",onDeviceReady,false); 

// PhoneGap is ready to be used! 
function onDeviceReady() { 
    pictureSource=navigator.camera.PictureSourceType; 
    destinationType=navigator.camera.DestinationType; 
} 

// Called when a photo is successfully retrieved 
function onPhotoDataSuccess(imageData) { 
    var largeImage = document.getElementById('largeImage'); 
    largeImage.style.display = 'block'; 
    largeImage.src = "data:image/jpeg;base64," + imageData; 
} 


function onPhotoURISuccess(imageURI) { 
    var largeImage = document.getElementById('largeImage'); 
    largeImage.style.display = 'block'; 
    largeImage.src = imageURI; 
} 

// A button will call this function 
function capturePhoto() { 
    //add new div 

    var newPhoto = document.createElement("div"); 
    newPhoto.id = "div";   
    newPhoto.className ="photo"; 
    newPhoto.innerHTML = "<img id='largeImage' src='' />"; 
    document.getElementById("photos").appendChild(newPhoto); 


    // Take picture using device camera and retrieve image as base64-encoded string 
    navigator.camera.getPicture(onPhotoDataSuccess, onPhotoURISuccess, onFail, { quality: 50 }); 
} 

// A button will call this function 
function getPhoto(source) { 
    //add new div 



    // Retrieve image file location from specified source 
    navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50, 
    destinationType: destinationType.FILE_URI, 
    sourceType: source }); 
} 


// Called if something bad happens. 
function onFail(message) { 
    alert('Failed because: ' + message); 

Answer 1

lo necesario para crear el div dinámicamente después de tomar cada fotografía. A su función éxito sería algo como esto:

function onPhotoDataSuccess(imageData) { 
    // the following is all one line. 
    document.getElementById("photos").innerHTML+= 
    "<div>\ 
     <img src=\"data:image/jpeg;base64,"+imageData+"\">\ 
    </div>"; 
} 

continuación, puede estilo de todas las becas individuales de movilidad a través de CSS usando algo como esto

#photos > div { 
    width: 100px; 
    margin:10px; 
    float:left; 
} 

Answer 2

A partir de Phonegap 3.5 no hay apoyo para la selección de varias imágenes a la al mismo tiempo. Tendrá que escribir o buscar un complemento que funcione con el código nativo para que pueda hacerlo. Aquí está el problema descrito en el plan de desarrollo Phonegap. https://issues.apache.org/jira/browse/CB-1215

Estoy trabajando en hacer esto también. Aquí hay un enlace para una solución de Android.

http://webcache.googleusercontent.com/search?q=cache:http://www.technotalkative.com/android-select-multiple-photos-from-gallery/