Hardware Access and Device APIs with JavaScript and HTML5

by Wes bos

Slides at http://wesbos.com/talks/jqueryto/

or http://github.com/wesbos

Speedometer

As part of what is returned from the navigator.geolocation.getCurrentLocation() method, for mobile devices speed is returned in metres per second

File Input & File Reader

File input is now supported in iOS6. Clicking input[type="file"] brings up selection from the camera roll. 

CRAPSTAGRAM

  1. create a webpage with 1 file input and 1 canvas.
  2. use the file input to select a photo from the camera roll
  3. Use JS FileReader() to read the file

Accelerometer

Code on github

Compass

deviceorientation event returns webkitCompassHeading (number of degrees relative to north) and webkitCompassAccuracy.

Camera / WebRTC

https://github.com/wesbos/HTML5-Security-Camera

http://html5securitycam.jit.su/ (run on camera)

http://html5securitycam.jit.su/viewer.html (view!)

RTC = Real Time Communications

Allows you to stream video via live stream through HTML5 and eliminates the reliance on Flash (thank goodness :). Create a peer 1-1 connection.

HTML greenscreen is the coolest thing.

Camera access uses getUserMedia()

Mobile - available on Opera and BB10!

Recording is still in development, however, Wes said that you could take pictures and compile them in Ffmpeg software. http://www.ffmpeg.org/

Summary

Second to last slide has "technology review" of what was covered - useful reference