I am working on app which allows user to upload image to server. Source of image can either be camera or from gallery but before uploading the image will be displayed in app
Now, my code is working properly when taking image from camera, It is showing in app body and also getting uploaded to server. But when I select an image from gallery, it neither shows it in the app, nor getting uploaded to server.
Same thing happened when I tried to execute the code given as full example in Phonegap forum
http://docs.phonegap.com/en/2.5.0/cordova_camera_camera.md.html#camera.getPicture
I am developing this app for Android and using Google Nexus 4 to test, I checked this on other mobiles running on Jellybean, ICS and Gingerbread and on these OS both camera and gallery are working properly.
Here is my JS code:
function takePicture() {
navigator.camera.getPicture(
function(uri) {
var img = document.getElementById('camera_image');
img.style.visibility = "visible";
img.style.display = "block";
img.src = uri;
document.getElementById('camera_status').innerHTML = "Success";
},
function(e) {
console.log("Error getting picture: " + e);
document.getElementById('camera_status').innerHTML = "Error getting picture.";
},
{ quality: 10, destinationType: navigator.camera.DestinationType.FILE_URI});
}
/**
* Select picture from library
*/
function selectPicture() {
navigator.camera.getPicture(
function(uri) {
var img = document.getElementById('camera_image');
img.style.visibility = "visible";
img.style.display = "block";
img.src = uri;
alert(uri);
document.getElementById('camera_status').innerHTML = "Success";
},
function(e) {
console.log("Error getting picture: " + e);
document.getElementById('camera_status').innerHTML = "Error getting picture.";
},
{ quality: 10, destinationType: navigator.camera.DestinationType.FILE_URI, sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY});
}
/**
* Upload current picture
*/
function uploadPicture() {
// Get URI of picture to upload
var img = document.getElementById('camera_image');
var imageURI = img.src;
alert(img+" "+imageURI);
if (!imageURI || (img.style.display == "none")) {
document.getElementById('camera_status').innerHTML = "Take picture or select picture from library first.";
return;
}
// Verify server has been entered
server = document.getElementById('serverUrl').value;
if (server) {
// Specify transfer options
var options = new FileUploadOptions();
options.headers = {Connection : "close"}
options.fileKey="file";
options.fileName=imageURI.substr(imageURI.lastIndexOf('/')+1);
options.mimeType="image/jpeg";
options.chunkedMode = false;
// Transfer picture to server
var ft = new FileTransfer();
alert(img+" "+imageURI);
alert("server "+server);
ft.upload(imageURI, server, function(r) {
document.getElementById('camera_status').innerHTML = "Upload successful: "+r.bytesSent+" bytes uploaded.";
}, function(error) {
document.getElementById('camera_status').innerHTML = "Upload failed: Code = "+error.code;
}, options);
}
}