Currently, I am developing an application using Phonegap that is specific for Android, iOS, and Windows phone platforms. As part of the app functionality, I am utilizing the Camera API to capture images on the user's device. However, at the moment, these captured pictures are not being stored locally and will be deleted upon reopening the app. To address this issue, I want to implement a feature that allows me to store these pictures on my server in formats like .jpeg using JavaScript/HTML. Can anyone guide me on how to create and save these image files?
var pictureSource; // source of the picture var destinationType; // determines the format of the returned value
// Wait for the device API libraries to load
//
document.addEventListener("deviceready",onDeviceReady,false);
// Device APIs are now accessible
//
function onDeviceReady() {
pictureSource = navigator.camera.PictureSourceType;
destinationType = navigator.camera.DestinationType;
}
// Function called when a photo is successfully retrieved as base64 data
//
function onPhotoDataSuccess(imageData) {
// Un-comment to view the base64-encoded image data
// console.log(imageData);
// Get the image element
//
var smallImage = document.getElementById('smallImage');
// Make image elements visible
//
smallImage.style.display = 'block';
// Display the captured photo
//
smallImage.src = "data:image/jpeg;base64," + imageData;
}
// Function called when a photo file URI is successfully retrieved
//
function onPhotoURISuccess(imageURI) {
// Un-comment to view the image file URI
// console.log(imageURI);
// Get the image element
//
var largeImage = document.getElementById('largeImage');
// Make image elements visible
//
largeImage.style.display = 'block';
// Display the captured photo
//
largeImage.src = imageURI;
}
// Function called by a button to capture a photo
//
function capturePhoto() {
// Capture a photo using the device camera and retrieve it as a base64-encoded string
navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50,
destinationType: destinationType.DATA_URL });
}
// Function called by a button to capture and edit a photo
//
function capturePhotoEdit() {
// Capture a photo using the device camera with editing allowed, and retrieve it as a base64-encoded string
navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, allowEdit: true,
destinationType: destinationType.DATA_URL });
}
// Function called by a button to get a photo from a specified source
//
function getPhoto(source) {
// Retrieve the image file location from the specified source
navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,
destinationType: destinationType.FILE_URI,
sourceType: source });
}
// Function called if an error occurs
//
function onFail(message) {
alert('Failed because: ' + message);
}