01.- PRIMER APLICACION EN PHONEGAP, SIN EMULADOR,SIN IDE,FACIL, SIN COMANDOS, EN 10 MINUTOS
HTML
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/bootstrap.min.css">
<style>
body {
padding-top: 50px;
padding-bottom: 20px;
}
</style>
<link rel="stylesheet" href="css/bootstrap-theme.min.css">
<link rel="stylesheet" href="css/main.css">
<script src="js/vendor/modernizr-2.6.2-respond-1.1.0.min.js"></script>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Project name</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<form class="navbar-form navbar-right" role="form">
<div class="form-group">
<input type="text" placeholder="Email" class="form-control">
</div>
<div class="form-group">
<input type="password" placeholder="Password" class="form-control">
</div>
<button type="submit" class="btn btn-success">Sign in</button>
</form>
</div><!--/.navbar-collapse -->
</div>
</nav>
<div class="jumbotron">
<div class="container">
<h1>Phonegap</h1>
<p><button id="tomarFoto" class="btn btn-primary btn-lg" role="button">Tomar foto</button></p>
<img id="contenedorFoto" class="img-responsive" style="display: none;"/>
<button id="insertar" class="btn btn-primary btn-lg" role="button">Insertar</button>
<button id="leer" class="btn btn-primary btn-lg" role="button">Leer</button>
</div>
</div>
<script src="js/vendor/jquery-1.11.1.js"></script>
<script src="js/vendor/bootstrap.min.js"></script>
<script src="cordova.js"></script>
<script src="js/main.js"></script>
</body>
</html>
JS
var db;
$(document).ready(function(){
$("#tomarFoto").click(function(){
navigator.camera.getPicture(exitoFoto,errorFoto,{quality:50});
});
db=window.openDatabase("CONTACTOS2","","DESCRIPCION",200000);
db.transaction(function(tx){
tx.executeSql("CREATE TABLE CONTACTO(id integer not null primary key autoincrement,nombre,telefono);");
},errorDB,exitoDB);
$("#insertar").click(function(){
db.transaction(function(tx){
tx.executeSql("INSERT INTO CONTACTO(nombre,telefono)VALUES('eugenio','4444444');");
},errorDB,exitoDB);
});
$("#leer").click(function(){
db.transaction(function(tx){
tx.executeSql("SELECT * FROM CONTACTO;",[],function(tx,rs){
for(var i=0;i<rs.rows.length;i++){
var p=rs.rows.item(i);
window.alert("nombre="+p.nombre+"------telefono"+p.telefono);
}
});
},errorDB,exitoDB);
});
});
function exitoFoto(url){
$("#contenedorFoto").attr("src",url);
$("#contenedorFoto").show();
}
function errorFoto(){
window.alert("error");
}
function errorDB(){
window.alert("error bd");
}
function exitoDB(){
window.alert("exito bd");
}
