CreateReadUpdateDelete base demo

Base for all other demos

by SchizoDuckie

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://schizoduckie.github.io/CreateReadUpdateDelete.js/src/CRUD.js"></script>
<script src="https://schizoduckie.github.io/CreateReadUpdateDelete.js/src/CRUD.SqliteAdapter.js"></script>
<script src="https://schizoduckie.github.io/CreateReadUpdateDelete.js/demo/Serie.js"></script>
<div class="well"><h1>CreateReadUpdateDelete.js Base Demo</h1>
<p>Base setup with one <a href="https://github.com/SchizoDuckie/CreateReadUpdateDelete.js/blob/master/demo/Serie.js">Serie entity</a> defined</div>

    <p>While you loaded this page, the following actions were executed</p>
<ul>
    <li>Open 'createreadupdatedelete' WebSQL database
    <li>Create table Series
    <li>Insert fixtures into table
    <li>Query fixtures and display them below
</ul>
 
        <h3>Series:</h3>
<pre id="series">
    
    
</pre>
        <button id="wipe">Wipe database</button>

JavaScript

CRUD.DEBUG = true;
// checkout the console to see debug info by CRUD.SqliteAdapter.js

if(!'openDatabase' in window) {
    alert("Your inferior browser does not support WebSQL. Try Chrome(ium), Safari, Opera, or any other Webkit based browser.");
}

// initialize WebSQL database connection
CRUD.setAdapter(new CRUD.SQLiteAdapter('createreadupdatedelete', {
    estimatedSize: 25 * 1024 * 1024
}));

// execute find query and serialize results to screen
CRUD.Find('Serie').then(function(results) {
   document.getElementById('series').innerHTML = JSON.stringify(results.map(function(r) {return r.asObject()}), null, "\t");  
});

// drop tables on click and reload page 
document.getElementById('wipe').onclick = function() {
    CRUD.executeQuery('drop table Series').then(function() {
		window.location.reload();
    });
};