Your SlideShare is downloading. ×
Location Aware Browsing
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Location Aware Browsing

2,791

Published on

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,791
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
57
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Location Aware Browsing Aizat Faiz aizat.faiz@gmail.com http://www.flickr.com/photos/st3f4n/2860706946/ http://creativecommons.org/licenses/by/3.0/
  • 2. http://www.flickr.com/photos/st3f4n/2860706946/ http://creativecommons.org/licenses/by/3.0/ Download and view at http://blog.aizatto.com/?p=3847
  • 3. Creative Commons http://www.flickr.com/photos/st3f4n/2860706946/ http://creativecommons.org/licenses/by/3.0/
  • 4. By Attribution http://www.flickr.com/photos/thevoicewithin/551651500/ http://creativecommons.org/licenses/by/3.0/
  • 5. Aizat Faiz [email_address]
  • 6. http://www.flickr.com/photos/willpate/111479065/
  • 7. HTML 5 http://www.flickr.com/photos/willpate/111479236/
  • 8. JavaScript http://www.flickr.com/photos/nyuhuhuu/3367743012/
  • 9. HTML 5 introduces an API to interact with Geolocation services Interaction is done via JavaScript http://www.flickr.com/photos/mrbill/2481198023/
  • 10. How does it find your location? Google Latitude GPS http://www.flickr.com/photos/sejhok/2343828092/
  • 11.  
  • 12. navigator.geolocation Geolocation API Specification http://dev.w3.org/geo/api/spec-source.html
  • 13. JavaScript Object Geolocation API Specification http://dev.w3.org/geo/api/spec-source.html
  • 14. 2 kinds of variables 3 functions 2 kinds of callbacks Simple API http://dev.w3.org/geo/api/spec-source.html
  • 15. Mozilla Firefox v3.5+ Browser Support Apple Safari 5 Google Chrome 5
  • 16. http://dev.w3.org/geo/api/spec-source.html
  • 17. 2 Variables Coordinates Position http://dev.w3.org/geo/api/spec-source.html#api_description
  • 18. http://dev.w3.org/geo/api/spec-source.html#api_description 3 Functions navigator.geolocation. getCurrentPosition navigator.geolocation. watchPosition navigator.geolocation. clearWatch
  • 19. http://dev.w3.org/geo/api/spec-source.html#api_description 2 Callbacks Success Callback Error Callback
  • 20. http://dev.w3.org/geo/api/spec-source.html#api_description Geolocation API Specification variables Coordinates Position functions navigator.geolocation.getCurrentPosition navigator.geolocation.watchPosition navigator.geolocation.clearWatch Callbacks Success Callback Error Callback
  • 21. http://dev.w3.org/geo/api/spec-source.html#api_description
  • 22. http://dev.w3.org/geo/api/spec-source.html#api_description 2 Variables Coordinates Position
  • 23. http://dev.w3.org/geo/api/spec-source.html#api_description JavaScript Objects
  • 24. http://dev.w3.org/geo/api/spec-source.html#coordinates_interface
  • 25. http://dev.w3.org/geo/api/spec-source.html#coordinates_interface Coordinates
  • 26. http://dev.w3.org/geo/api/spec-source.html#coordinates_interface Describe location Coordinates
  • 27. http://dev.w3.org/geo/api/spec-source.html#coordinates_interface Coordinates
  • 33. http://dev.w3.org/geo/api/spec-source.html#coordinates_interface Coordinates Description Variable Name Latitude coordinates.latitude Longitude coordinates.longitude Accuracy coordinates.accuracy Altitude coordinates.altitude Altitude Accuracy coordinates.altitudeAccuracy Heading coordinates.heading Speed coordinates.speed
  • 34. http://dev.w3.org/geo/api/spec-source.html#position_interface
  • 35. http://dev.w3.org/geo/api/spec-source.html#position_interface Position
  • 36. http://dev.w3.org/geo/api/spec-source.html#position_interface Describes Time and Location Position
  • 37. http://dev.w3.org/geo/api/spec-source.html#position_interface Position Timestamp and Coordinates
  • 38. http://dev.w3.org/geo/api/spec-source.html#position_interface Position Description Variable Name Coordinates position.coordinates Timestamp position.timestamp
  • 39. http://dev.w3.org/geo/api/spec-source.html#position_interface Coordinates and Position Coordinates Position coordinates.latitude position.coordinates coordinates.longitude position.timestamp coordinates.accuracy coordinates.altitude coordinates.altitudeAccuracy coordinates.heading coordinates.speed
  • 40. http://dev.w3.org/geo/api/spec-source.html#get-current-position
  • 41. http://dev.w3.org/geo/api/spec-source.html#get-current-position navigator.geolocation.getCurrentPosition
  • 42. http://dev.w3.org/geo/api/spec-source.html#get-current-position navigator.geolocation.getCurrentPosition Returns current Position
  • 43. JavaScript Implementation
  • 44. navigator.geolocation.getCurrentPosition
  • 45. navigator.geolocation.getCurrentPosition ① ③ ② ① browser object ② function call ③ success callback
  • 46. navigator.geolocation.getCurrentPosition
  • 47. HTML and JavaScript Implementation
  • 48. navigator.geolocation.getCurrentPosition
  • 49. navigator.geolocation.getCurrentPosition if condition is required, in case browser does not support geolocation
  • 50. Your browser will try to request permissions to determine your location
  • 51. Mozilla Firefox v3.5+
  • 52. Google Chrome 5
  • 53. Apple Safari 5
  • 54. ① ② ① success callback ② error callback
  • 55. The Building Blocks
  • 56. Location Aware Browsing Aizat Faiz aizat.faiz@gmail.com http://www.flickr.com/photos/st3f4n/2860706946/ Thank You

×