Remote web debugging at mobile devices in Safari and Firefox
Introduction to Mobile Safari
20
Introduction to Mobile Safari Alberto, Gilles and Marc
-
Upload
les-developpeurs-iphone-de-suisse-romande -
Category
Technology
-
view
1.385 -
download
1
description
Introduction to Mobile Safari by Alberto, Gilles and Marc (www.antistatique.net)
Transcript of Introduction to Mobile Safari
Introduction toMobile Safari
Alberto, Gilles and Marc
Mobile Safari24/10/2009
www.antistatique.net
Content
- Introduction
- Mobile Safari- GIS
- Client-side storage
- Demo
2
Mobile Safari24/10/2009
www.antistatique.net
Introduction
- About us
- Web guru
- iPhone fans
- Symfony framework
3
Mobile Safari24/10/2009
www.antistatique.net
Mobile Safari
- CSS (animations)
- Geolocalisation support (OS 3.x)
- Client-Side Storage (OS 2.1)
4
Mobile Safari24/10/2009
www.antistatique.net
Geolocalisation
navigator.geolocation.getCurrentPosition(
successCallback,
errorCallback,
option
)
5
navigator.geolocation.getCurrentPosition( function(pos){ var lat = pos.coords.latitude; var lng = pos.coords.longitude; }, function(error){ switch(error.code){ /*[...]*/ } }, { enableHighAccuracy: true, timeout: 45000, // in millisecond maximumAge: 60000 };);
Mobile Safari24/10/2009
www.antistatique.net
Client-side storage
- 5 Mb
- SQLite
7
//// OPEN LOCAL DATABASEvar db;if (window.openDatabase) db = openDatabase("as_note", "1.0", "AS Note", 200000);
//// DO A SELECTdb.transaction(function(tx) { tx.executeSql("SELECT id, note FROM MyTable WHERE id = ?", [27], function(tx, rs) { for (var i = 0; i < rs.rows.length; ++i) { /* ... */ renderNote(rs.rows.item(i)); } }, function(tx, error) { /* ... */ });});
//// CREATE TABLE IF NOT EXISTSfunction init(){ db.transaction(function(tx) { tx.executeSql("SELECT COUNT(*) FROM MyTable", [], function(result) { doSomething(); }, function(tx, error) { tx.executeSql("CREATE TABLE MyTable ( id INTEGER PRIMARY KEY, note TEXT, timestamp REAL)", [], function(rs){ doSomething(); }); }); });}
Mobile Safari24/10/2009
www.antistatique.net
Little web app
- Write notes
- Localize them
- Do it offline
- Take your iPhone : http://note.antistatique.net
10
Mobile Safari24/10/2009
www.antistatique.net
Further development
- Account system
- Server synchronisation
17
Mobile Safari24/10/2009
www.antistatique.net
Benefits of webApps
- Easy to develop, update
- No install required
- Apple free ~
18
Mobile Safari24/10/2009
www.antistatique.net
Backwards
- Interactions with native apps
- Animation
- More
19
Mobile Safari24/10/2009
www.antistatique.net
Sources- http://developer.apple.com/
- Safari and iPhone
- http://dev.w3.org/geo/api/spec-source.html
- Geolocation API Specification
- http://www.w3.org/TR/offline-webapps/
- Offline Web Applications
- http://www.jqtouch.com/
- plugin for mobile web development on the iPhone, Android, Palm Pre
20
