Firefox OS - supercharged HTML5

Firefox OS - supercharged HTML5

firefox phone

Mobile challenges…

  • World-wide coverage
  • Lightweight applications
  • Context-specific interfaces
  • Simple distribution
  • Developers, Developers, Developers

Neuland

HTML5

HTML5 is mobile

Promises

iPhone without an SDK

Jobs' original vision - no third party native apps

…and realities.

Newton's cradle not working

Barriers to HTML5 success

  • Hardware lockout
  • Outdated stock browsers
  • Second class performance citizenship
  • Lack of interoperability with the OS

A new beginning…

Firefox OS

Predictable browser support

firefox

A old, new market

World wide web

Upgrading the mobile world

Nokia couldn't take photos
  • Targeted at new, emerging markets
  • Very affordable hardware
  • No credit card needed - client billing
  • Web technologies through and through
  • 18 mobile partners, 5 hardware partners

Give me that hardware!

Hardware blowup

https://wiki.mozilla.org/WebAPI

Marketplace

Firefox marketplace

Firefox Marketplace

Find app by content

Defined by manifest

        {
          "name": "My App",
          "description": "My elevator pitch goes here",
          "launch_path": "/",
          "icons": { "128": "/img/icon-128.png" },
          "developer": {
            "name": "Your name or organization",
            "url": "http://your-homepage-here.org"
          }
        }
      

App manifest

Three levels of access…

  • Hosted apps - stored on your server, easy to upgrade, limited access.
  • Privileged apps - reviewed by the App store, uses a Content Security Policy, hosted on trusted server
  • Certified apps - part of the OS, only by Mozilla and partners

App permissions

Web APIs (hosted apps)

  • Vibration API
  • Screen Orientation
  • Geolocation API
  • Mouse Lock API
  • Open WebApps
  • Network Information API
  • Battery Status API
  • Alarm API
  • Push Notifications API
  • WebFM API / FMRadio
  • WebPayment
  • IndexedDB
  • Ambient light sensor
  • Proximity sensor
  • Notification

Using WebAPIs to make the web layer more capable

Install apps from the web

        var installapp = navigator.mozApps.install(manifestURL);
        installapp.onsuccess = function(data) {
          // App is installed
        };
        installapp.onerror = function() {
         // App wasn't installed, info is in 
         // installapp.error.name
        };
        

Web APIs (privileged apps)

  • Device Storage API
  • Browser API
  • TCP Socket API
  • Contacts API
  • systemXHR

Using WebAPIs to make the web layer more capable

Web APIs (certified apps)

  • WebTelephony
  • WebSMS
  • Idle API
  • Settings API
  • Power Management API
  • Mobile Connection API
  • WiFi Information API
  • WebBluetooth
  • Permissions API
  • Network Stats API
  • Camera API
  • Time/Clock API
  • Attention screen
  • Voicemail

Using WebAPIs to make the web layer more capable

Giving control to the user

Pick activity

Web Activities

  • configure
  • costcontrol
  • dial
  • open
  • pick
  • record
  • save-bookmark
  • share
  • view
  • new, f.e type: “websms/sms” or “webcontacts/contact”

https://wiki.mozilla.org/WebAPI/WebActivities

Get an image from the phone (1/2)

        var getphoto = new MozActivity({
          name: "pick",
          data: {
            type: ["image/png", "image/jpg", "image/jpeg"]
          }
        });
      

Get an image from the phone (2/2)

        getphoto.onsuccess = function () {
          var img = document.createElement("img");
          if (this.result.blob.type.indexOf("image") != -1) {
            img.src = window.URL.createObjectURL(this.result.blob);
          }
        };
        getphoto.onerror = function () { // error
        };
      

Activities/Hosted Apps on Android

Foxkeh loves android

Developer Hub

Developer Hub

Firefox OS Developer Hub

Simulator in the browser

Simulator

Firefox OS Simulator 1.0 is here!

Phones for developers

Geeksphone

Geeksphone.com

Re-use and level up!

Please don't hurt the new web
  • A whole new audience
  • HTML5 without the lock-out
  • Your web site is your ad!
  • Minimal extra work, it works across platforms

Thanks!

that's all firefox