Capture photo with camera and store in DB Phonegap - sqlite

Question

I am trying to build an app using Phonegap (Cordova 2.2). I am fairly new to code and js in particular so please be patient if some of my questions seem daft. My question has a few parts:
I want the user to be able to enter name and image (using the device camera) to create their profile. I have tested on the emulator and so far they can enter their name and get take a photo with camera. These both display in the emulator on completion. However, obviously I want to save that detail, so, I have created a DB (from reading, local storage is limited in size).
1. Is the database done correctly? I am getting neither error nor success alerts.
2. I am struggling with the logic of how I pass the information into the database. I'm guessing that I call the populate_UsersDB() function on a click event and need to write some sort of INSERT INTO userProfiles VALUE something. Also, can I grab the Imagedata directly from the onPhotoFileSuccess() function and send it into the database from there.
3. If I don't want to have a done button (rather have a 'Tap here to take picture' placeholder), how do I test that the action is complete and send the info to the db. From reading, I think I can use onChange(), but not sure. Also, guessing I have to use post or get somewhere?
Sorry, I know there is a lot of questions within this question. Any advice or support is greatly appreciated. Thanks. Here's the code.
//Use the device camera to capture an image of the user
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) {
// Get image handle
var smallImage = document.getElementById('smallImage');
// Unhide image elements
//
smallImage.style.display = 'block';
// Show the captured photo
// The inline CSS rules are used to resize the image
//
smallImage.src = "data:image/jpeg;base64," + imageData;
}
// Called when a photo is successfully retrieved
function onPhotoFileSuccess(imageData) {
// Get image handle
console.log(JSON.stringify(imageData));
// Get image handle
//
var smallImage = document.getElementById('smallImage');
// Unhide image elements
//
smallImage.style.display = 'block';
// Show the captured photo
// The inline CSS rules are used to resize the image
//
smallImage.src = imageData;
}
// A button will call this function
function capturePhotoWithData() {
// Take picture using device camera and retrieve image as base64-encoded string
navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality:50, destinationType:Camera.DestinationType.DATA_URL });
}
function getPhoto(source) {
// Retrieve image file location from specified source
navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,
destinationType: destinationType.FILE_URI,
sourceType: source });
}
// Called if something goes wrong.
function onFail(message) {
alert('Failed because: ' + message);
}
//CREATE THE DATABASE
document.addEventListener("deviceready", onDeviceReady, false);
var db = window.openDatabase("Users_DB", "1.0", "User Profiles DB", 200000); //will create database or open it
//function will be called when device ready
function onDeviceReady(){
db.transaction(populateUsers_DB, errorCB, successCB);
}
//create table
function populateUsers_DB(tx) {
tx.executeSql('CREATE TABLE IF NOT EXISTS userProfiles (id INTEGER PRIMARY KEY AUTOINCREMENT, Name TEXT NOT NULL, Image BLOB)');
tx.executeSql('INSERT INTO userProfiles(Name) VALUE ("")');
}
//function will be called when an error occurred
function errorCB(err) {
alert("Error processing SQL: "+err.code);
}
//function will be called when process succeed
function successCB() {
alert("success!");
db.transaction(queryDB,errorCB);
}
//select all from userProfiles
function queryDB(tx){
tx.executeSql('SELECT * FROM userProfiles',[],querySuccess,errorCB);
}
function querySuccess(tx,result){
$('#userList').empty();
$.each(result.rows,function(index){
var row = result.rows.item(index);
$('#userList').append('<li><h3 class="ui-li-heading">'+row['Image']+'</h3><p class="ui-li-desc">Name '+row['Name']+'</p></li>');
});
$('#userList').listview();
}