Safari Mobile
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Safari Mobile

on

  • 5,673 views

 

Statistics

Views

Total Views
5,673
Views on SlideShare
5,645
Embed Views
28

Actions

Likes
1
Downloads
15
Comments
0

3 Embeds 28

http://www.slideshare.net 24
http://www.linkedin.com 3
https://www.linkedin.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Safari Mobile Presentation Transcript

  • 1. Introduction to Mobile Safari Alberto, Gilles and Marc
  • 2. Mobile Safari 24/10/2009 Content - Introduction - Mobile Safari - GIS - Client-side storage - Demo www.antistatique.net 2
  • 3. Mobile Safari 24/10/2009 Introduction - About us - Web guru - iPhone fans - Symfony framework www.antistatique.net 3
  • 4. Mobile Safari 24/10/2009 Mobile Safari - CSS (animations) - Geolocalisation support (OS 3.x) - Client-Side Storage (OS 2.1) www.antistatique.net 4
  • 5. Mobile Safari 24/10/2009 Geolocalisation navigator.geolocation.getCurrentPosition( successCallback, errorCallback, option ) www.antistatique.net 5
  • 6. 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 }; );
  • 7. Mobile Safari 24/10/2009 Client-side storage - 5 Mb - SQLite www.antistatique.net 7
  • 8. //// OPEN LOCAL DATABASE var db; if (window.openDatabase) db = openDatabase("as_note", "1.0", "AS Note", 200000); //// DO A SELECT db.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) { /* ... */ }); });
  • 9. //// CREATE TABLE IF NOT EXISTS function 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(); }); }); }); }
  • 10. Mobile Safari 24/10/2009 Little web app - Write notes - Localize them - Do it offline - Take your iPhone : http://note.antistatique.net www.antistatique.net 10
  • 11. Mobile Safari 24/10/2009 Further development - Account system - Server synchronisation www.antistatique.net 17
  • 12. Mobile Safari 24/10/2009 Benefits of webApps - Easy to develop, update - No install required - Apple free ~ www.antistatique.net 18
  • 13. Mobile Safari 24/10/2009 Backwards - Interactions with native apps - Animation - More www.antistatique.net 19
  • 14. Mobile Safari 24/10/2009 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 www.antistatique.net 20