Phonegap - Capture image to Photo Library and display in HTML

Question

I have been using the following code to grab a photo and display it in html works great.

 function takePicture() {

    navigator.camera.getPicture(
        function(uri) {
            var img = document.getElementById('camera_image1');
            img.style.visibility = "visible";
            img.style.display = "block";
            img.src = uri;
            document.getElementById('camera_status').innerHTML = "Success";

        },

        { quality: 50, allowEdit: true, destinationType: navigator.camera.DestinationType.FILE_URI});
};

html later

 <img style="width:144px;height:144px;" id="camera_image1" src="nophoto.jpg"/>

but... this does not save the image to the cameras photo library so I tweaked line to

  navigator.device.capture.captureImage

This now captures image to library but

1. no longer displays in html
2. No longer allows me to edit the photo after I have taken photo in the camera 'app'

Any pointer much appreciated.

PhoneGap 1.3

Answer 1

When captureImage succeeds, it passes an array of MediaFile objects to your callback (an array since it's possible to have more than one result, but your example will only have one). The MediaFile objects contain the full path. You should be able to use code similar to what you have above to point to the file uri.

As to your second question - not sure what you expect here. "Image Capture" isn't editing per se. You would need to build your own editor using JavaScript - which would be overkill probably.