Going OfflineWith GWT and

GearsTom Peck

AppEngines, LLC

Why?•Web apps are great ... if you can

connect

•Planes

•Trains

•Automobiles

•Users may not want their data in the cloud

•Increase response time for online apps

How?

GWT - Google Web ToolkitGoogle Gears

Google Web Toolkit

Write AJAX Applications in Java

Google Web Toolkit•Program in Java, compile to

JavaScript

•JavaScript is highly optimized

•Programming model similar to Swing

•RPC mechanism for calling server

•Debug web apps in Eclipse

•http://code.google.com/webtoolkit

•http://code.google.com/p/gwt-google-apis/

Google Gears

Google Gears

•Browser Plugin (FireFox, Internet Explorer)

•http://gears.google.com

•Features:

•LocalServer (“programmable cache”)

•SQLite Database

•Worker Threads for JavaScript

Take Your App Offline

1.Manifest file of your app’s resources

2.Download resources

3.Create database schema

4.Go

Manifest File{ "betaManifestVersion": 1, "version": "Version 1.0", "entries": [ { "url": "7EEF8FB6BA93DAAD0AB9A64C6D6471FE.cache.html" }, { "url": "7EEF8FB6BA93DAAD0AB9A64C6D6471FE.cache.js" }, { "url": "7EEF8FB6BA93DAAD0AB9A64C6D6471FE.cache.xml" }, { "url": "87AA9AB2FB06214DC10C32E7B35C5F6A.cache.html" }, { "url": "87AA9AB2FB06214DC10C32E7B35C5F6A.cache.js" }, { "url": "87AA9AB2FB06214DC10C32E7B35C5F6A.cache.xml" }, { "url": "884D363F8887607F5180653AA6B10E6D.cache.html" }, { "url": "884D363F8887607F5180653AA6B10E6D.cache.js" }, { "url": "884D363F8887607F5180653AA6B10E6D.cache.xml" }, { "url": "com.company.CompanyApp.nocache.js" }, { "url": "gears_init.js" }, { "url": "gwt.js" }, { "url": "CompanyApp.html" }, { "url": "default.css" }, { "url": "logo1.png" }, ] }

Load ResourcesLocalServer localServer = new LocalServer();ManagedResourceStore managedRS = localServer.createManagedResourceStore("CompanyApp");managedRS.setManifestURL("http://company.com/manifest.json");managedR.checkForUpdate();new Timer() { public void run() { switch (managedResourceStore.getUpdateStatus()) { case ManagedResourceStore.UPDATE_OK: statusLabel.setText("Ready for offline access"); break; case ManagedResourceStore.UPDATE_CHECKING: case ManagedResourceStore.UPDATE_DOWNLOADING: schedule(500); break; case ManagedResourceStore.UPDATE_FAILED: statusLabel.setText("Unable to go offline); break; } } }.schedule(500);

Gears Database

•Uses SQLite

•Simplified SQL syntax

•http://sqlite.org

Create Database

•“create table if not exists person (id integer, first_name text, last_name text)”

•Datatypes: Integer, Real, Text, Blob

•Constraints: “primary key”, “not null”, “unique”, etc.

Create Database

private Database m_database = null;

try {m_database = new Database(“Test”);ResultSet rs = m_database.execute(“create table...”);rs.close();

} // trycatch (Exception e) {

// Gears not installed} // catch

QueriesString sql = “select id, first_name, last_name from person”;ResultSet rs = m_database.execute(sql);ArrayList results = new ArrayList();while (rs.isValidRow()) { PersonBean person = new PersonBean(); person.setID(rs.getFieldAsInt(0)); person.setFirstName(rs.getFieldAsString(1)); person.setLastName(rs.getFieldAsString(2)); results.add(person); rs.next();} // whilers.close();

Insert, UpdateString args[] = new String[3];args[0] = Integer.toString(person.getID());args[1] = person.getFirstName();args[2] = person.getLastName();ResultSet rs = m_database.execute(“insert into person (id, first_name, last_name) values (?,?,?)”, args);rs.close();

args = new String[3];args[0] = person.getFirstName();args[1] = person.getLastName();args[2] = Integer.toString(person.getID());rs = m_database.execute(“update person set first_name=?, last_name=? where id=?)”, args);rs.close();

Demo

Demo Source Codehttp://www.appengines.com/Stickies.zip

Syncing Issues•Need GUIDs

•Need timestamps (SQLite has no Date)

•Need a strategy:

•Last one wins

•Lock / Check out

•Let user decide

ConclusionGoogle Gears allows web applications to run

offline

Google Web Toolkit makes it easy to program Gears

Thank You