KcDkFb88

1// Sentencias SQL
2var createStatement = "CREATE TABLE IF NOT EXISTS Contacts (id INTEGER PRIMARY KEY AUTOINCREMENT, username TEXT, useremail TEXT)";
3var selectAllStatement = "SELECT * FROM Contacts";
4var insertStatement = "INSERT INTO Contacts (username, useremail) VALUES (?, ?)";
5var updateStatement = "UPDATE Contacts SET username = ?, useremail = ? WHERE id=?";
6var deleteStatement = "DELETE FROM Contacts WHERE id=?";
7var dropStatement = "DROP TABLE Contacts";
8var db = openDatabase("AddressBook", "1.0", "Address Book", 200000); // Abrir Base de datos SQLite
9var dataset;
10var DataType;
11
12function initDatabase() // Funcion llamada cuando esta lista.
13{
14    try {
15        if (!window.openDatabase) // Checkea que el navegador soporte SQLi.
16        {
17            alert('Base de datos no son soportadas en el navegador.');
18        } else {
19            createTable(); // Si lo soporta crea las tablas.
20        }
21    } catch (e) {
22        if (e == 2) {
23            // Comprueba que la versión sea valida 
24            console.log("Version de la Base de datos invalida.");
25        } else {
26            console.log("Error desconocido " + e + ".");
27        }
28        return;
29    }
30}
31
32function createTable() // Función que crea las tablas..
33{
34    db.transaction(function(tx) {
35        tx.executeSql(createStatement, [], showRecords, onError);
36    });
37}
38
39function insertRecord() // Obtiene el valor desde el formulario y es insertado como un nuevo registro.
40{
41    var usernametemp = $('input:text[id=username]').val();
42    var useremailtemp = $('input:text[id=useremail]').val();
43    db.transaction(function(tx) {
44        tx.executeSql(insertStatement, [usernametemp, useremailtemp], loadAndReset, onError);
45    });
46}
47
48function deleteRecord(id) // Obtiene el identificador luego borra el registro.
49{
50    var iddelete = id.toString();
51    db.transaction(function(tx) {
52        tx.executeSql(deleteStatement, [id], showRecords, onError);
53        alert("Borrado satisfactorio.");
54    });
55    resetForm();
56}
57
58function updateRecord() // Obtiene el identificador y los campos del formulario luego actualiza el registro.
59{
60    var usernameupdate = $('input:text[id=username]').val().toString();
61    var useremailupdate = $('input:text[id=useremail]').val().toString();
62    var useridupdate = $("#id").val();
63    db.transaction(function(tx) {
64        tx.executeSql(updateStatement, [usernameupdate, useremailupdate, Number(useridupdate)], loadAndReset, onError);
65    });
66}
67
68function dropTable() // Eliminar Tabla 
69{
70    db.transaction(function(tx) {
71        tx.executeSql(dropStatement, [], showRecords, onError);
72    });
73    resetForm();
74    initDatabase();
75}
76
77function loadRecord(i) // Muestra los registros de la base de datos
78{
79    var item = dataset.item(i);
80    $("#username").val((item['username']).toString());
81    $("#useremail").val((item['useremail']).toString());
82    $("#id").val((item['id']).toString());
83}
84
85function resetForm() // Función que reiniciar todos los valores
86{
87    $("#username").val("");
88    $("#useremail").val("");
89    $("#id").val("");
90}
91
92function loadAndReset() // Función que permite cargar y reiniciar todo.
93{
94    resetForm();
95    showRecords()
96}
97
98function onError(tx, error) // Función para manejar errores.
99{
100    alert(error.message);
101}
102
103function showRecords() // Función que muestra todos los datos en una lista.
104{
105    $("#results").html('')
106    db.transaction(function(tx) {
107        tx.executeSql(selectAllStatement, [], function(tx, result) {
108            dataset = result.rows;
109            for (var i = 0, item = null; i < dataset.length; i++) {
110                item = dataset.item(i);
111                var linkeditdelete = '<li>' + item['username'] + ' , ' + item['useremail'] + '    ' + '<a href="#" onclick="loadRecord(' + i + ');">Editar</a>' + '    ' + '<a href="#" onclick="deleteRecord(' + item['id'] + ');">Borrar</a></li>';
112                $("#results").append(linkeditdelete);
113            }
114        });
115    });
116}
117
118function initDatabase() // Funcion llamada cuando esta lista.
119{
120    try {
121        if (!window.openDatabase) // Checkea que el navegador soporte SQLi.
122        {
123            alert('Base de datos no son soportadas en el navegador.');
124        } else {
125            createTable(); // Si lo soporta crea las tablas.
126        }
127    } catch (e) {
128        if (e == 2) {
129            // Comprueba que la versión sea valida 
130            console.log("Version de la Base de datos invalida.");
131        } else {
132            console.log("Error desconocido " + e + ".");
133        }
134        return;
135    }
136}
137
138function createTable() // Función que crea las tablas..
139{
140    db.transaction(function(tx) {
141        tx.executeSql(createStatement, [], showRecords, onError);
142    });
143}
144
145function insertRecord() // Obtiene el valor desde el formulario y es insertado como un nuevo registro.
146{
147    var usernametemp = $('input:text[id=username]').val();
148    var useremailtemp = $('input:text[id=useremail]').val();
149    db.transaction(function(tx) {
150        tx.executeSql(insertStatement, [usernametemp, useremailtemp], loadAndReset, onError);
151    });
152}
153
154function deleteRecord(id) // Obtiene el identificador luego borra el registro.
155{
156    var iddelete = id.toString();
157    db.transaction(function(tx) {
158        tx.executeSql(deleteStatement, [id], showRecords, onError);
159        alert("Borrado satisfactorio.");
160    });
161    resetForm();
162}
163
164function updateRecord() // Obtiene el identificador y los campos del formulario luego actualiza el registro.
165{
166    var usernameupdate = $('input:text[id=username]').val().toString();
167    var useremailupdate = $('input:text[id=useremail]').val().toString();
168    var useridupdate = $("#id").val();
169    db.transaction(function(tx) {
170        tx.executeSql(updateStatement, [usernameupdate, useremailupdate, Number(useridupdate)], loadAndReset, onError);
171    });
172}
173
174function dropTable() // Eliminar Tabla 
175{
176    db.transaction(function(tx) {
177        tx.executeSql(dropStatement, [], showRecords, onError);
178    });
179    resetForm();
180    initDatabase();
181}
182
183function loadRecord(i) // Muestra los registros de la base de datos
184{
185    var item = dataset.item(i);
186    $("#username").val((item['username']).toString());
187    $("#useremail").val((item['useremail']).toString());
188    $("#id").val((item['id']).toString());
189}
190
191function resetForm() // Función que reiniciar todos los valores
192{
193    $("#username").val("");
194    $("#useremail").val("");
195    $("#id").val("");
196}
197
198function loadAndReset() // Función que permite cargar y reiniciar todo.
199{
200    resetForm();
201    showRecords()
202}
203
204function onError(tx, error) // Función para manejar errores.
205{
206    alert(error.message);
207}
208
209function showRecords() // Función que muestra todos los datos en una lista.
210{
211    $("#results").html('')
212    db.transaction(function(tx) {
213        tx.executeSql(selectAllStatement, [], function(tx, result) {
214            dataset = result.rows;
215            for (var i = 0, item = null; i < dataset.length; i++) {
216                item = dataset.item(i);
217                var linkeditdelete = '<li>' + item['username'] + ' , ' + item['useremail'] + '    ' + '<a href="#" onclick="loadRecord(' + i + ');">Editar</a>' + '    ' + '<a href="#" onclick="deleteRecord(' + item['id'] + ');">Borrar</a></li>';
218                $("#results").append(linkeditdelete);
219            }
220        });
221    });
222}
223$(document).ready(function() // Se ejecuta cuando carga la página
224    {;
225        $("body").fadeIn(2000);
226        initDatabase();
227        // Registra los eventos en los controles.
228        $("#submitButton").click(insertRecord);
229        $("#btnUpdate").click(updateRecord);
230        $("#btnReset").click(resetForm);
231        $("#btnDrop").click(dropTable);
232    });