$30 off During Our Annual Pro Sale. View Details »

Mobile Device APIs for Fun and Profit

Mobile Device APIs for Fun and Profit

Fluent, 2012

James Pearce

May 30, 2012
Tweet

More Decks by James Pearce

Other Decks in Technology

Transcript

  1. Client-side APIs that enable the development of Web Applications that

    interact with device hardware http://www.w .org/ / /DeviceAPICharter “ ”
  2. Storage GPS device Audio player Video player Accelerometer Compass Camera

    Bluetooth Telephony Messaging Contacts Calendar Notifications Proximity sensor Thermometer Pressure gauge NFC RFID
  3. <a  href="call.wmls#makeCall()">    Call  us </a> //  call.wmls extern  function

     makeCall()  {    WTAPublic.makeCall("16505551234"); }
  4. //  sms.wmls extern  function  sendMsg()  {    WTANetText.send("16505551234",  "WML  rocks");

    } extern  function  readMsg(i)  {    var  sms  =  WTANetText.read(i);    return  WTANetText.getFieldValue(        sms,  "body"    ); }
  5. //  contacts.wmls extern  function  addFriend(i,  num,  name)  {    WTAPhoneBook.write(i,

     num,  name); } //  return  structs  of  contact  details extern  function  getFriendById(i)  {    return  WTAPhoneBook.read("i",  i); } extern  function  getFriendByName(name)  {    return  WTAPhoneBook.read("t",  name); }
  6. ▪ Accelerometer ▪ Calendar ▪ Camera ▪ Contacts ▪ Core

    ▪ Device interaction ▪ Device status ▪ File system ▪ Geolocation ▪ Messaging ▪ Orientation ▪ Tasks ▪ Viewport ▪ Webview http://specs.wacapps.net/
  7. to create client-side APIs that enable the development of Web

    Applications [..] that interact with devices' services such as Calendar, Contacts, Camera, etc “ ” http://www.w .org/ /dap/
  8. ▪ Media Capture (forms) ▪ Media Capture (.getUserMedia) ▪ Contacts

    ▪ Battery Status ▪ Network Information ▪ Sensor ▪ Vibration ▪ Calendar ▪ Menu ▪ Permissions ▪ Media Capture (.device) ▪ Messaging ▪ Gallery ▪ System info
  9. var  bearing  =  Math.atan2(    Math.sin(lon2  -­‐  lon1)  *  Math.cos(lat2),

         Math.cos(lat1)  *  Math.sin(lat2)  -­‐    Math.sin(lat1)  *  Math.cos(lat2)  *    Math.cos(lon2  -­‐  lon1) )  *  180  /  Math.PI; arrow.style.webkitTransform  =    'rotateZ('  +  bearing  +  'deg)'; http://www.movable-type.co.uk/scripts/latlong.html
  10. <input  type="file"  accept="image/*"  id="photo"  /> var  photo  =  document.getElementById('photo'); photo.files[0].getFormatData(

       function  (data)  {},  //  success    function  ()  {}            //  error ); //  file  is  a  MediaFile,  extending  File. //  data  is  a  MediaFileData,  containing: //      codecs,  bitrate,  height,  width,  duration http://dev.w .org/ /dap/camera/
  11. navigator.getUserMedia(    {        audio:  false,    

       video:  true    },    function  (stream)  {},  //  success    function  ()  {}                //  error ); //  stream  is  a  LocalMediaStream: //  use  URL.createObjectURL(stream) //  to  bind  to  <video>  src http://dev.w .org/ /webrtc/editor/getusermedia.html
  12. Temperature, ºC AmbientLight, Lux AmbientNoise, dbA MagneticField, uTesla Proximity, cm

    AtmPressure, kP RelHumidity, var  sensor  =  new      SensorConnection(        'Temperature'    );
  13. navigator.contacts.find(    ['name',  'emails'],          //  fields

       function  (contacts)  {},  //  success    function  ()  {},                  //  error    {                                              //  find  options          filter:  'James',          multiple:  true    } ); //  displayName,  name,  nickname,  phoneNumbers //  emails,  addresses,  ims,  organizations,  birthday //  note,  photos,  categories,  urls http://www.w .org/TR/contacts-api/
  14. The ability to add and update contact information is not

    a function of the API provided in this specification “ ”
  15. <a  id="vcard">Save  Contacts</a> var  vcard  =      'BEGIN:VCARD\r\n'  +

       'VERSION:3.0\r\n'  +    'UID:'  +  contact.id  +  '\r\n'  +          'N:Pearce;James\r\n'  +    'FN:James  Pearce\r\n'  +    'END:VCARD'; document.getElementById('vcard').href  =    'data:text/x-­‐vcard;charset=utf-­‐8,'  +    encodeURIComponent(vcard);
  16. navigator.sendMessage(    "sms:16505551234?"  +    "body=JavaScript%20says%20hi",      [],  

                           //  attachments  as  File  array    function  ()  {},  //  success    function  ()  {}    //  error ); //  also  mms:  and  mailto: http://dev.w .org/ /dap/messaging/
  17. ▪ Telephony ▪ Messaging ▪ Contacts ▪ Camera ▪ Network

    ▪ USB ▪ Embedded browser ▪ Battery ▪ Device Status ▪ Settings ▪ Mouse Lock ▪ Vibration ▪ NFC ▪ Bluetooth ▪ Calendar ▪ Background services
  18. https://wiki.mozilla.org/WebAPI “ ” The Mozilla WebAPI team is pushing the

    envelope of the web to include - and in places exceed - the capabilities of competing stacks
  19. var  myCall  =    navigator.telephony.dial("16505551234"); myCall.state;    //  dialing,  ringing,

     busy,  connecting,    //  connected,  disconnecting,  disconnected,      //  incoming myCall.onconnected  =  function  ()  {};    //  onbusy,  ondisconnected  etc myCall.hangup(); myCall2.answer(); https://wiki.mozilla.org/WebAPI/WebTelephony
  20. var  contact  =  new  mozContact(); contact.init({    name:  'James',  

     tel:  '16505551234' }); navigator.mozContacts.save(contact);