I would like to begin using the client-side database functionality of html5, but I don't know where to go for a good introduction/tutorial/how-to. I've been coding (x)html for years and years, so I'm not so much interested in a "here's the <head> element" type of introduction; I want to learn about what's new in html5 in general, and client-side db in particular. Any suggestions?
views:
1213answers:
2
A:
Here: http://www.weboshelp.net/webos-tutorials/156-palm-webos-html5-database-storage-tutorial :)
Some more useful links:
Shadi Almosri
2009-06-13 15:31:03
(i know it's aimed at the palm web OS but it's because they use the latest webkit build that supports HTML5 client side db storage)
Shadi Almosri
2009-06-13 15:33:04
Thanks. Weird thing, though: I checked out the first link above, and it doesn't render correctly, in either Safari 4 or Firefox 3 (both on Mac OS X). It's as if the text is shifted 20px or so left, and therefore out of the window. Is it just me?Third link looks promising; I'll probably check it out more thoroughly tomorrow. Thanks again.
Alex Basson
2009-06-14 00:43:37
+2
A:
Alex, I wrote up a detailed method of how to do it at: http://wecreategames.com/blog/?p=219 - including source code to download. Here's a few snippets:
function picsInitDatabase() {
try {
if (!window.openDatabase) {
console.log('Databases are not supported in this browser');
} else {
var shortName = 'picsGeoDB';
var version = '1.0';
var displayName = 'Pictures Geotagged database';
var maxSize = 5000000; // in bytes
picsDB = openDatabase(shortName, version, displayName, maxSize);
console.log("Database is setup: "+picsDB);
}
} catch(e) {
// Error handling code goes here.
if (e == 2) {
// Version number mismatch.
console.log("Invalid database version.");
} else {
console.log("Unknown error "+e+".");
}
return;
}
} And here's a function to update the table.
function picsUpdateTables(dataID){
picsDB.transaction(
function (transaction) {
var p = data[dataID];
transaction.executeSql("INSERT INTO geopictures (id, secret, server, farm, title, latitude, longitude, accuracy, datetaken, ownername) VALUES (?,?,?,?,?,?,?,?,?,?);",
[p.id, p.secret, p.server, p.farm, p.title, p.latitude, p.longitude, p.accuracy, p.datetaken, p.ownername] );
transaction.executeSql("INSERT INTO photodata (picid, encodedtext) VALUES (?, ?)", [p.id, serializeCanvasByID(p.id)] );
}
);
}
See the blog post for examples of how to do SQL SELECTS, and a video showing how to test it on a few browsers.
JayCrossler
2009-06-19 18:08:05
The downloadable source code makes this completely worthwhile. Great job.
Justin Lilly
2009-12-09 05:05:00