SlideShare a Scribd company logo
1 of 67
WebAPIs & more
@robertnyman
Firefox OS




  Using HTML5, CSS and
  JavaScript together with a
  number of APIs to build
  apps and customize the UI.
WebAPIs
https://wiki.mozilla.org/WebAPI
Security Levels
Web Content                        Certified Web App

Regular web content                Device-critical applications

Installed Web App

A regular web app

Privileged Web App

More access, more responsibility
https://wiki.mozilla.org/
WebAPI#Planned_for_initial_release_of_B2G_.
          28aka_Basecamp.29
"permissions": {
    "contacts": {
        "description": "Required for autocompletion in the share screen",
        "access": "readcreate"
    },
    "alarms": {
        "description": "Required to schedule notifications"
    }
}
Vibration API (W3C)             Web Activities
Screen Orientation              Push Notifications API
Geolocation API                 WebFM API
Mouse Lock API (W3C)            WebPayment
Open WebApps                    IndexedDB (W3C)
Network Information API (W3C)   Ambient light sensor
Battery Status API (W3C)        Proximity sensor
Alarm API                       Notification




                      REGULAR APIS
BATTERY STATUS
API
var battery = navigator.battery;
if (battery) {
        var batteryLevel = Math.round(battery.level * 100) + "%",
            charging = (battery.charging)? "" : "not ",
            chargingTime = parseInt(battery.chargingTime / 60, 10,
            dischargingTime = parseInt(battery.dischargingTime / 60, 10);

    // Set events
    battery.addEventListener("levelchange", setStatus, false);
    battery.addEventListener("chargingchange", setStatus, false);
    battery.addEventListener("chargingtimechange", setStatus, false);
    battery.addEventListener("dischargingtimechange", setStatus, false);
}
NOTIFICATION
var notification = navigator.mozNotification;
notification.createNotification(
    "See this",
    "This is a notification",
    iconURL
);
SCREEN
ORIENTATION API
// Portrait mode:
screen.mozLockOrientation("portrait");

/*
     Possible values:
         "landscape"
         "portrait"
         "landscape-primary"
         "landscape-secondary"
         "portrait-primary"
         "portrait-secondary"
*/
VIBRATION API
// Vibrate for one second
navigator.vibrate(1000);

// Vibration pattern [vibrationTime, pause,…]
navigator.vibrate([200, 100, 200, 100]);

// Vibrate for 5 seconds
navigator.vibrate(5000);

// Turn off vibration
navigator.vibrate(0);
WEB PAYMENTS
var pay = navigator.mozPay(paymentToken);
pay.onsuccess = function (event) {
    // Weee! Money!
};
NETWORK
INFORMATION API
var connection = window.navigator.mozConnection,
    online = connection.bandwidth > 0,
    metered = connection.metered;
ALARM API
var alarmId1,
    request = navigator.mozAlarms.add(
        new Date("May 15, 2012 16:20:00"),
        "honorTimezone",
        {
            mydata: "my event"
        }
    );

request.onsuccess = function (event) {
    alarmId1 = event.target.result;
};

request.onerror = function (event) {
    console.log(event.target.error.name);
};
var request = navigator.mozAlarms.getAll();

request.onsuccess = function (event) {
    console.log(JSON.stringify(event.target.result));
};

request.onerror = function (event) {
    console.log(event.target.error.name);
};
navigator.mozSetMessageHandler(
    "alarm",
    function (message) {
        // Note: message has to be set in the manifest file
        console.log("Alarm fired: " + JSON.stringify(message));
    }
);
DEVICEPROXIMITY
window.addEventListener("deviceproximity", function (event) {
    // Current device proximity, in centimeters
    console.log(event.value);

      // The maximum sensing distance the sensor is
      // able to report, in centimeters
      console.log(event.max);

      // The minimum sensing distance the sensor is
      // able to report, in centimeters
      console.log(event.min);
});
AMBIENT LIGHT
EVENTS
window.addEventListener("devicelight", function (event) {
    // The level of the ambient light in lux
    console.log(event.value);
});
window.addEventListener("lightlevel", function (event) {
    // Possible values: "normal", "bright", "dim"
    console.log(event.value);
});
window.addEventListener("devicelight", function (event) {
    // The lux values for "dim" typically begin below 50,
    // and the values for "bright" begin above 10000
    console.log(event.value);
});
Device Storage API
Browser API
TCP Socket API
Contacts API
systemXHR




                 PRIVILEGED APIS
DEVICE STORAGE
API
var deviceStorage = navigator.getDeviceStorage("videos");
// "external", "shared", or "default".
deviceStorage.type;

// Add a file - returns DOMRequest with file name
deviceStorage.add(blob);

// Same as .add, with provided name
deviceStorage.addNamed(blob, name);

// Returns DOMRequest/non-editable File object
deviceStorage.get(name);

// Returns editable FileHandle object
deviceStorage.getEditable(name);

// Returns DOMRequest with success or failure
deviceStorage.delete(name);

// Enumerates files
deviceStorage.enumerate([directory]);

// Enumerates files as FileHandles
deviceStorage.enumerateEditable([directory]);
var storage = navigator.getDeviceStorage("videos"),
    cursor = storage.enumerate();

cursor.onerror = function() {
   console.error("Error in DeviceStorage.enumerate()", cursor.error.name);
};

cursor.onsuccess = function() {
    if (!cursor.result)
        return;

     var file = cursor.result;

     // If this isn't a video, skip it
     if (file.type.substring(0, 6) !== "video/") {
         cursor.continue();
         return;
     }

     // If it isn't playable, skip it
     var testplayer = document.createElement("video");
     if (!testplayer.canPlayType(file.type)) {
         cursor.continue();
         return;
     }
};
CONTACTS API
var contact = new mozContact();
contact.init({name: "Tom"});

var request = navigator.mozContacts.save(contact);
request.onsuccess = function() {
    console.log("Success");
};

request.onerror = function() {
    console.log("Error")
};
WEB ACTIVITIES
{
    "activities": {
        "share": {
            "filters": {
                "type": ["image/png", "image/gif"]
            }
            "href": "sharing.html",
            "disposition": "window"
        }
    }
}
var activity = new MozActivity({
    name: "view",
    data: {
        type: "image/png",
        url: ...
    }
});

activity.onsuccess = function () {
    console.log("Showing the image!");
};

activity.onerror = function () {
    console.log("Can't view the image!");
};
Future APIs
Resource lock API         Spellcheck API
UDP Datagram Socket API   LogAPI
Peer to Peer API          Keyboard/IME API
WebNFC                    WebRTC
WebUSB                    FileHandle API
HTTP-cache API            Sync API
Calendar API
Installing apps
https://addons.mozilla.org/firefox/addon/firefox-os-
                    simulator/
FIREFOX OS
                        BOILERPLATE APP



https://github.com/robnyman/Firefox-OS-Boilerplate-App
WebRTC
var video = document.querySelector('video');

navigator.getUserMedia = navigator.getUserMedia ||
navigator.webkitGetUserMedia || navigator.mozGetUserMedia ||
navigator.msGetUserMedia;
window.URL = window.URL || window.webkitURL || window.mozURL ||
window.msURL;

// Call the getUserMedia method with our callback functions
if (navigator.getUserMedia) {
    navigator.getUserMedia({video: true}, successCallback, errorCallback);
} else {
    console.log('Native web camera streaming (getUserMedia) not supported
in this browser.');
    // Display a friendly "sorry" message to the user
}
function successCallback(stream) {
    // Set the source of the video element with the stream from the camera
    if (video.mozSrcObject !== undefined) {
        video.mozSrcObject = stream;
    } else {
        video.src = (window.URL && window.URL.createObjectURL(stream)) ||
stream;
    }
    video.play();
}
Getting help
https://lists.mozilla.org/listinfo/dev-webapps

         irc://irc.mozilla.org/
           #openwebapps
Trying things out
Robert Nyman
robertnyman.com
robert@mozilla.com
Mozilla

   @robertnyman

More Related Content

What's hot

HTML5 on Mobile
HTML5 on MobileHTML5 on Mobile
HTML5 on MobileAdam Lu
 
HTML5 APIs - Where no man has gone before! - Altran
HTML5 APIs - Where no man has gone before! - AltranHTML5 APIs - Where no man has gone before! - Altran
HTML5 APIs - Where no man has gone before! - AltranRobert Nyman
 
Instant and offline apps with Service Worker
Instant and offline apps with Service WorkerInstant and offline apps with Service Worker
Instant and offline apps with Service WorkerChang W. Doh
 
Web versus Native: round 1!
Web versus Native: round 1!Web versus Native: round 1!
Web versus Native: round 1!Chris Mills
 
APIs, now and in the future
APIs, now and in the futureAPIs, now and in the future
APIs, now and in the futureChris Mills
 
HTML5, The Open Web, and what it means for you - MDN Hack Day, Sao Paulo
HTML5, The Open Web, and what it means for you - MDN Hack Day, Sao PauloHTML5, The Open Web, and what it means for you - MDN Hack Day, Sao Paulo
HTML5, The Open Web, and what it means for you - MDN Hack Day, Sao PauloRobert Nyman
 
JQuery UK Service Workers Talk
JQuery UK Service Workers TalkJQuery UK Service Workers Talk
JQuery UK Service Workers TalkNatasha Rooney
 
JQuery UK February 2015: Service Workers On Vacay
JQuery UK February 2015: Service Workers On VacayJQuery UK February 2015: Service Workers On Vacay
JQuery UK February 2015: Service Workers On VacayNatasha Rooney
 
APIs for modern web apps
APIs for modern web appsAPIs for modern web apps
APIs for modern web appsChris Mills
 
2011 a grape odyssey
2011   a grape odyssey2011   a grape odyssey
2011 a grape odysseyMike Hagedorn
 
Authenticating and Securing Node.js APIs
Authenticating and Securing Node.js APIsAuthenticating and Securing Node.js APIs
Authenticating and Securing Node.js APIsJimmy Guerrero
 
ILUG 2010 - Deploying plug-ins to the enterprise
ILUG 2010 - Deploying plug-ins to the enterpriseILUG 2010 - Deploying plug-ins to the enterprise
ILUG 2010 - Deploying plug-ins to the enterpriseRené Winkelmeyer
 
PrimeTime JSF with PrimeFaces - Dec 2014
PrimeTime JSF with PrimeFaces - Dec 2014PrimeTime JSF with PrimeFaces - Dec 2014
PrimeTime JSF with PrimeFaces - Dec 2014cagataycivici
 
Empowering the "mobile web"
Empowering the "mobile web"Empowering the "mobile web"
Empowering the "mobile web"Chris Mills
 
Forensic Tools for In-Depth Performance Investigations
Forensic Tools for In-Depth Performance InvestigationsForensic Tools for In-Depth Performance Investigations
Forensic Tools for In-Depth Performance InvestigationsNicholas Jansma
 

What's hot (19)

Android swedroid
Android swedroidAndroid swedroid
Android swedroid
 
HTML5 on Mobile
HTML5 on MobileHTML5 on Mobile
HTML5 on Mobile
 
Android in practice
Android in practiceAndroid in practice
Android in practice
 
HTML5 APIs - Where no man has gone before! - Altran
HTML5 APIs - Where no man has gone before! - AltranHTML5 APIs - Where no man has gone before! - Altran
HTML5 APIs - Where no man has gone before! - Altran
 
Instant and offline apps with Service Worker
Instant and offline apps with Service WorkerInstant and offline apps with Service Worker
Instant and offline apps with Service Worker
 
HTML5 WebWorks
HTML5 WebWorksHTML5 WebWorks
HTML5 WebWorks
 
Web versus Native: round 1!
Web versus Native: round 1!Web versus Native: round 1!
Web versus Native: round 1!
 
APIs, now and in the future
APIs, now and in the futureAPIs, now and in the future
APIs, now and in the future
 
HTML5, The Open Web, and what it means for you - MDN Hack Day, Sao Paulo
HTML5, The Open Web, and what it means for you - MDN Hack Day, Sao PauloHTML5, The Open Web, and what it means for you - MDN Hack Day, Sao Paulo
HTML5, The Open Web, and what it means for you - MDN Hack Day, Sao Paulo
 
JQuery UK Service Workers Talk
JQuery UK Service Workers TalkJQuery UK Service Workers Talk
JQuery UK Service Workers Talk
 
Android best practices
Android best practicesAndroid best practices
Android best practices
 
JQuery UK February 2015: Service Workers On Vacay
JQuery UK February 2015: Service Workers On VacayJQuery UK February 2015: Service Workers On Vacay
JQuery UK February 2015: Service Workers On Vacay
 
APIs for modern web apps
APIs for modern web appsAPIs for modern web apps
APIs for modern web apps
 
2011 a grape odyssey
2011   a grape odyssey2011   a grape odyssey
2011 a grape odyssey
 
Authenticating and Securing Node.js APIs
Authenticating and Securing Node.js APIsAuthenticating and Securing Node.js APIs
Authenticating and Securing Node.js APIs
 
ILUG 2010 - Deploying plug-ins to the enterprise
ILUG 2010 - Deploying plug-ins to the enterpriseILUG 2010 - Deploying plug-ins to the enterprise
ILUG 2010 - Deploying plug-ins to the enterprise
 
PrimeTime JSF with PrimeFaces - Dec 2014
PrimeTime JSF with PrimeFaces - Dec 2014PrimeTime JSF with PrimeFaces - Dec 2014
PrimeTime JSF with PrimeFaces - Dec 2014
 
Empowering the "mobile web"
Empowering the "mobile web"Empowering the "mobile web"
Empowering the "mobile web"
 
Forensic Tools for In-Depth Performance Investigations
Forensic Tools for In-Depth Performance InvestigationsForensic Tools for In-Depth Performance Investigations
Forensic Tools for In-Depth Performance Investigations
 

Similar to Firefox OS Web APIs Guide

Web APIs & Apps - Mozilla
Web APIs & Apps - MozillaWeb APIs & Apps - Mozilla
Web APIs & Apps - MozillaRobert Nyman
 
WebAPIs & Apps - Mozilla London
WebAPIs & Apps - Mozilla LondonWebAPIs & Apps - Mozilla London
WebAPIs & Apps - Mozilla LondonRobert Nyman
 
Firefox OS, une plateforme à découvrir - IO Saglac - 2014-09-09
Firefox OS, une plateforme à découvrir - IO Saglac - 2014-09-09Firefox OS, une plateforme à découvrir - IO Saglac - 2014-09-09
Firefox OS, une plateforme à découvrir - IO Saglac - 2014-09-09Frédéric Harper
 
Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...
Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...
Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...Frédéric Harper
 
Firefox OS learnings & visions, WebAPIs - budapest.mobile
Firefox OS learnings & visions, WebAPIs - budapest.mobileFirefox OS learnings & visions, WebAPIs - budapest.mobile
Firefox OS learnings & visions, WebAPIs - budapest.mobileRobert Nyman
 
HTML, not just for desktops: Firefox OS - Congreso Universitario Móvil - 201...
HTML, not just for desktops: Firefox OS - Congreso Universitario Móvil - 201...HTML, not just for desktops: Firefox OS - Congreso Universitario Móvil - 201...
HTML, not just for desktops: Firefox OS - Congreso Universitario Móvil - 201...Frédéric Harper
 
HTML pour le web mobile, Firefox OS - Devfest Nantes - 2014-11-07
HTML pour le web mobile, Firefox OS - Devfest Nantes - 2014-11-07HTML pour le web mobile, Firefox OS - Devfest Nantes - 2014-11-07
HTML pour le web mobile, Firefox OS - Devfest Nantes - 2014-11-07Frédéric Harper
 
WebRTC & Firefox OS - presentation at Google
WebRTC & Firefox OS - presentation at GoogleWebRTC & Firefox OS - presentation at Google
WebRTC & Firefox OS - presentation at GoogleRobert Nyman
 
Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12
Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12
Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12Frédéric Harper
 
Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28
Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28
Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28Frédéric Harper
 
Cutting edge HTML5 API you can use today (by Bohdan Rusinka)
 Cutting edge HTML5 API you can use today (by Bohdan Rusinka) Cutting edge HTML5 API you can use today (by Bohdan Rusinka)
Cutting edge HTML5 API you can use today (by Bohdan Rusinka)Binary Studio
 
Firefox OS Web APIs, taking it to the next level
Firefox OS Web APIs, taking it to the next levelFirefox OS Web APIs, taking it to the next level
Firefox OS Web APIs, taking it to the next levelFrédéric Harper
 
Firefox OS workshop, Colombia
Firefox OS workshop, ColombiaFirefox OS workshop, Colombia
Firefox OS workshop, ColombiaRobert Nyman
 
Firefox OS: HTML5 sur les stéroïdes - HTML5mtl - 2014-04-22
Firefox OS: HTML5 sur les stéroïdes - HTML5mtl - 2014-04-22Firefox OS: HTML5 sur les stéroïdes - HTML5mtl - 2014-04-22
Firefox OS: HTML5 sur les stéroïdes - HTML5mtl - 2014-04-22Frédéric Harper
 
Bringing the Open Web & APIs to 
mobile devices with Firefox OS - Geek Meet
Bringing the Open Web & APIs to 
mobile devices with Firefox OS - Geek MeetBringing the Open Web & APIs to 
mobile devices with Firefox OS - Geek Meet
Bringing the Open Web & APIs to 
mobile devices with Firefox OS - Geek MeetRobert Nyman
 
Mozilla, Firefox OS and the Open Web
Mozilla, Firefox OS and the Open WebMozilla, Firefox OS and the Open Web
Mozilla, Firefox OS and the Open WebRobert Nyman
 
Øredev2013 - FirefoxOS - the platform HTML5 deserves
Øredev2013 - FirefoxOS - the platform HTML5 deservesØredev2013 - FirefoxOS - the platform HTML5 deserves
Øredev2013 - FirefoxOS - the platform HTML5 deservesChristian Heilmann
 
HTML5 & The Open Web - at Nackademin
HTML5 & The Open Web -  at NackademinHTML5 & The Open Web -  at Nackademin
HTML5 & The Open Web - at NackademinRobert Nyman
 
Mozilla Web Apps - Super-VanJS
Mozilla Web Apps - Super-VanJSMozilla Web Apps - Super-VanJS
Mozilla Web Apps - Super-VanJSRobert Nyman
 

Similar to Firefox OS Web APIs Guide (20)

Web APIs & Apps - Mozilla
Web APIs & Apps - MozillaWeb APIs & Apps - Mozilla
Web APIs & Apps - Mozilla
 
WebAPIs & Apps - Mozilla London
WebAPIs & Apps - Mozilla LondonWebAPIs & Apps - Mozilla London
WebAPIs & Apps - Mozilla London
 
Firefox OS, une plateforme à découvrir - IO Saglac - 2014-09-09
Firefox OS, une plateforme à découvrir - IO Saglac - 2014-09-09Firefox OS, une plateforme à découvrir - IO Saglac - 2014-09-09
Firefox OS, une plateforme à découvrir - IO Saglac - 2014-09-09
 
Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...
Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...
Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...
 
Firefox OS learnings & visions, WebAPIs - budapest.mobile
Firefox OS learnings & visions, WebAPIs - budapest.mobileFirefox OS learnings & visions, WebAPIs - budapest.mobile
Firefox OS learnings & visions, WebAPIs - budapest.mobile
 
HTML, not just for desktops: Firefox OS - Congreso Universitario Móvil - 201...
HTML, not just for desktops: Firefox OS - Congreso Universitario Móvil - 201...HTML, not just for desktops: Firefox OS - Congreso Universitario Móvil - 201...
HTML, not just for desktops: Firefox OS - Congreso Universitario Móvil - 201...
 
HTML pour le web mobile, Firefox OS - Devfest Nantes - 2014-11-07
HTML pour le web mobile, Firefox OS - Devfest Nantes - 2014-11-07HTML pour le web mobile, Firefox OS - Devfest Nantes - 2014-11-07
HTML pour le web mobile, Firefox OS - Devfest Nantes - 2014-11-07
 
WebRTC & Firefox OS - presentation at Google
WebRTC & Firefox OS - presentation at GoogleWebRTC & Firefox OS - presentation at Google
WebRTC & Firefox OS - presentation at Google
 
Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12
Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12
Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12
 
Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28
Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28
Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28
 
Cutting edge HTML5 API you can use today (by Bohdan Rusinka)
 Cutting edge HTML5 API you can use today (by Bohdan Rusinka) Cutting edge HTML5 API you can use today (by Bohdan Rusinka)
Cutting edge HTML5 API you can use today (by Bohdan Rusinka)
 
Firefox OS
Firefox OSFirefox OS
Firefox OS
 
Firefox OS Web APIs, taking it to the next level
Firefox OS Web APIs, taking it to the next levelFirefox OS Web APIs, taking it to the next level
Firefox OS Web APIs, taking it to the next level
 
Firefox OS workshop, Colombia
Firefox OS workshop, ColombiaFirefox OS workshop, Colombia
Firefox OS workshop, Colombia
 
Firefox OS: HTML5 sur les stéroïdes - HTML5mtl - 2014-04-22
Firefox OS: HTML5 sur les stéroïdes - HTML5mtl - 2014-04-22Firefox OS: HTML5 sur les stéroïdes - HTML5mtl - 2014-04-22
Firefox OS: HTML5 sur les stéroïdes - HTML5mtl - 2014-04-22
 
Bringing the Open Web & APIs to 
mobile devices with Firefox OS - Geek Meet
Bringing the Open Web & APIs to 
mobile devices with Firefox OS - Geek MeetBringing the Open Web & APIs to 
mobile devices with Firefox OS - Geek Meet
Bringing the Open Web & APIs to 
mobile devices with Firefox OS - Geek Meet
 
Mozilla, Firefox OS and the Open Web
Mozilla, Firefox OS and the Open WebMozilla, Firefox OS and the Open Web
Mozilla, Firefox OS and the Open Web
 
Øredev2013 - FirefoxOS - the platform HTML5 deserves
Øredev2013 - FirefoxOS - the platform HTML5 deservesØredev2013 - FirefoxOS - the platform HTML5 deserves
Øredev2013 - FirefoxOS - the platform HTML5 deserves
 
HTML5 & The Open Web - at Nackademin
HTML5 & The Open Web -  at NackademinHTML5 & The Open Web -  at Nackademin
HTML5 & The Open Web - at Nackademin
 
Mozilla Web Apps - Super-VanJS
Mozilla Web Apps - Super-VanJSMozilla Web Apps - Super-VanJS
Mozilla Web Apps - Super-VanJS
 

More from Robert Nyman

Have you tried listening?
Have you tried listening?Have you tried listening?
Have you tried listening?Robert Nyman
 
Building for Your Next Billion - Google I/O 2017
Building for Your Next Billion - Google I/O 2017Building for Your Next Billion - Google I/O 2017
Building for Your Next Billion - Google I/O 2017Robert Nyman
 
Introduction to Google Daydream
Introduction to Google DaydreamIntroduction to Google Daydream
Introduction to Google DaydreamRobert Nyman
 
Predictability for the Web
Predictability for the WebPredictability for the Web
Predictability for the WebRobert Nyman
 
The Future of Progressive Web Apps - View Source conference, Berlin 2016
The Future of Progressive Web Apps - View Source conference, Berlin 2016The Future of Progressive Web Apps - View Source conference, Berlin 2016
The Future of Progressive Web Apps - View Source conference, Berlin 2016Robert Nyman
 
The Future of the Web - Cold Front conference 2016
The Future of the Web - Cold Front conference 2016The Future of the Web - Cold Front conference 2016
The Future of the Web - Cold Front conference 2016Robert Nyman
 
The Future of Progressive Web Apps - Google for Indonesia
The Future of Progressive Web Apps - Google for IndonesiaThe Future of Progressive Web Apps - Google for Indonesia
The Future of Progressive Web Apps - Google for IndonesiaRobert Nyman
 
Google tech & products
Google tech & productsGoogle tech & products
Google tech & productsRobert Nyman
 
Introduction to Progressive Web Apps, Google Developer Summit, Seoul - South ...
Introduction to Progressive Web Apps, Google Developer Summit, Seoul - South ...Introduction to Progressive Web Apps, Google Developer Summit, Seoul - South ...
Introduction to Progressive Web Apps, Google Developer Summit, Seoul - South ...Robert Nyman
 
Progressive Web Apps keynote, Google Developer Summit, Tokyo, Japan
Progressive Web Apps keynote, Google Developer Summit, Tokyo, JapanProgressive Web Apps keynote, Google Developer Summit, Tokyo, Japan
Progressive Web Apps keynote, Google Developer Summit, Tokyo, JapanRobert Nyman
 
The web - What it has, what it lacks and where it must go - keynote at Riga D...
The web - What it has, what it lacks and where it must go - keynote at Riga D...The web - What it has, what it lacks and where it must go - keynote at Riga D...
The web - What it has, what it lacks and where it must go - keynote at Riga D...Robert Nyman
 
The web - What it has, what it lacks and where it must go - Bulgaria Web Summ...
The web - What it has, what it lacks and where it must go - Bulgaria Web Summ...The web - What it has, what it lacks and where it must go - Bulgaria Web Summ...
The web - What it has, what it lacks and where it must go - Bulgaria Web Summ...Robert Nyman
 
The web - What it has, what it lacks and where it must go - Istanbul
The web - What it has, what it lacks and where it must go - IstanbulThe web - What it has, what it lacks and where it must go - Istanbul
The web - What it has, what it lacks and where it must go - IstanbulRobert Nyman
 
The web - What it has, what it lacks and where it must go
The web - What it has, what it lacks and where it must goThe web - What it has, what it lacks and where it must go
The web - What it has, what it lacks and where it must goRobert Nyman
 
Google, the future and possibilities
Google, the future and possibilitiesGoogle, the future and possibilities
Google, the future and possibilitiesRobert Nyman
 
Developer Relations in the Nordics
Developer Relations in the NordicsDeveloper Relations in the Nordics
Developer Relations in the NordicsRobert Nyman
 
What is Developer Relations?
What is Developer Relations?What is Developer Relations?
What is Developer Relations?Robert Nyman
 
Android TV Introduction - Stockholm Android TV meetup
Android TV Introduction - Stockholm Android TV meetupAndroid TV Introduction - Stockholm Android TV meetup
Android TV Introduction - Stockholm Android TV meetupRobert Nyman
 
New improvements for web developers - frontend.fi, Helsinki
New improvements for web developers - frontend.fi, HelsinkiNew improvements for web developers - frontend.fi, Helsinki
New improvements for web developers - frontend.fi, HelsinkiRobert Nyman
 
Mobile phone trends, user data & developer climate - frontend.fi, Helsinki
Mobile phone trends, user data & developer climate - frontend.fi, HelsinkiMobile phone trends, user data & developer climate - frontend.fi, Helsinki
Mobile phone trends, user data & developer climate - frontend.fi, HelsinkiRobert Nyman
 

More from Robert Nyman (20)

Have you tried listening?
Have you tried listening?Have you tried listening?
Have you tried listening?
 
Building for Your Next Billion - Google I/O 2017
Building for Your Next Billion - Google I/O 2017Building for Your Next Billion - Google I/O 2017
Building for Your Next Billion - Google I/O 2017
 
Introduction to Google Daydream
Introduction to Google DaydreamIntroduction to Google Daydream
Introduction to Google Daydream
 
Predictability for the Web
Predictability for the WebPredictability for the Web
Predictability for the Web
 
The Future of Progressive Web Apps - View Source conference, Berlin 2016
The Future of Progressive Web Apps - View Source conference, Berlin 2016The Future of Progressive Web Apps - View Source conference, Berlin 2016
The Future of Progressive Web Apps - View Source conference, Berlin 2016
 
The Future of the Web - Cold Front conference 2016
The Future of the Web - Cold Front conference 2016The Future of the Web - Cold Front conference 2016
The Future of the Web - Cold Front conference 2016
 
The Future of Progressive Web Apps - Google for Indonesia
The Future of Progressive Web Apps - Google for IndonesiaThe Future of Progressive Web Apps - Google for Indonesia
The Future of Progressive Web Apps - Google for Indonesia
 
Google tech & products
Google tech & productsGoogle tech & products
Google tech & products
 
Introduction to Progressive Web Apps, Google Developer Summit, Seoul - South ...
Introduction to Progressive Web Apps, Google Developer Summit, Seoul - South ...Introduction to Progressive Web Apps, Google Developer Summit, Seoul - South ...
Introduction to Progressive Web Apps, Google Developer Summit, Seoul - South ...
 
Progressive Web Apps keynote, Google Developer Summit, Tokyo, Japan
Progressive Web Apps keynote, Google Developer Summit, Tokyo, JapanProgressive Web Apps keynote, Google Developer Summit, Tokyo, Japan
Progressive Web Apps keynote, Google Developer Summit, Tokyo, Japan
 
The web - What it has, what it lacks and where it must go - keynote at Riga D...
The web - What it has, what it lacks and where it must go - keynote at Riga D...The web - What it has, what it lacks and where it must go - keynote at Riga D...
The web - What it has, what it lacks and where it must go - keynote at Riga D...
 
The web - What it has, what it lacks and where it must go - Bulgaria Web Summ...
The web - What it has, what it lacks and where it must go - Bulgaria Web Summ...The web - What it has, what it lacks and where it must go - Bulgaria Web Summ...
The web - What it has, what it lacks and where it must go - Bulgaria Web Summ...
 
The web - What it has, what it lacks and where it must go - Istanbul
The web - What it has, what it lacks and where it must go - IstanbulThe web - What it has, what it lacks and where it must go - Istanbul
The web - What it has, what it lacks and where it must go - Istanbul
 
The web - What it has, what it lacks and where it must go
The web - What it has, what it lacks and where it must goThe web - What it has, what it lacks and where it must go
The web - What it has, what it lacks and where it must go
 
Google, the future and possibilities
Google, the future and possibilitiesGoogle, the future and possibilities
Google, the future and possibilities
 
Developer Relations in the Nordics
Developer Relations in the NordicsDeveloper Relations in the Nordics
Developer Relations in the Nordics
 
What is Developer Relations?
What is Developer Relations?What is Developer Relations?
What is Developer Relations?
 
Android TV Introduction - Stockholm Android TV meetup
Android TV Introduction - Stockholm Android TV meetupAndroid TV Introduction - Stockholm Android TV meetup
Android TV Introduction - Stockholm Android TV meetup
 
New improvements for web developers - frontend.fi, Helsinki
New improvements for web developers - frontend.fi, HelsinkiNew improvements for web developers - frontend.fi, Helsinki
New improvements for web developers - frontend.fi, Helsinki
 
Mobile phone trends, user data & developer climate - frontend.fi, Helsinki
Mobile phone trends, user data & developer climate - frontend.fi, HelsinkiMobile phone trends, user data & developer climate - frontend.fi, Helsinki
Mobile phone trends, user data & developer climate - frontend.fi, Helsinki
 

Recently uploaded

Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)
Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)
Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)Mark Simos
 
Accelerating Enterprise Software Engineering with Platformless
Accelerating Enterprise Software Engineering with PlatformlessAccelerating Enterprise Software Engineering with Platformless
Accelerating Enterprise Software Engineering with PlatformlessWSO2
 
A Journey Into the Emotions of Software Developers
A Journey Into the Emotions of Software DevelopersA Journey Into the Emotions of Software Developers
A Journey Into the Emotions of Software DevelopersNicole Novielli
 
Irene Moetsana-Moeng: Stakeholders in Cybersecurity: Collaborative Defence fo...
Irene Moetsana-Moeng: Stakeholders in Cybersecurity: Collaborative Defence fo...Irene Moetsana-Moeng: Stakeholders in Cybersecurity: Collaborative Defence fo...
Irene Moetsana-Moeng: Stakeholders in Cybersecurity: Collaborative Defence fo...itnewsafrica
 
Microservices, Docker deploy and Microservices source code in C#
Microservices, Docker deploy and Microservices source code in C#Microservices, Docker deploy and Microservices source code in C#
Microservices, Docker deploy and Microservices source code in C#Karmanjay Verma
 
React Native vs Ionic - The Best Mobile App Framework
React Native vs Ionic - The Best Mobile App FrameworkReact Native vs Ionic - The Best Mobile App Framework
React Native vs Ionic - The Best Mobile App FrameworkPixlogix Infotech
 
QCon London: Mastering long-running processes in modern architectures
QCon London: Mastering long-running processes in modern architecturesQCon London: Mastering long-running processes in modern architectures
QCon London: Mastering long-running processes in modern architecturesBernd Ruecker
 
Kuma Meshes Part I - The basics - A tutorial
Kuma Meshes Part I - The basics - A tutorialKuma Meshes Part I - The basics - A tutorial
Kuma Meshes Part I - The basics - A tutorialJoão Esperancinha
 
Zeshan Sattar- Assessing the skill requirements and industry expectations for...
Zeshan Sattar- Assessing the skill requirements and industry expectations for...Zeshan Sattar- Assessing the skill requirements and industry expectations for...
Zeshan Sattar- Assessing the skill requirements and industry expectations for...itnewsafrica
 
Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...
Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...
Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...Nikki Chapple
 
Long journey of Ruby standard library at RubyConf AU 2024
Long journey of Ruby standard library at RubyConf AU 2024Long journey of Ruby standard library at RubyConf AU 2024
Long journey of Ruby standard library at RubyConf AU 2024Hiroshi SHIBATA
 
Why device, WIFI, and ISP insights are crucial to supporting remote Microsoft...
Why device, WIFI, and ISP insights are crucial to supporting remote Microsoft...Why device, WIFI, and ISP insights are crucial to supporting remote Microsoft...
Why device, WIFI, and ISP insights are crucial to supporting remote Microsoft...panagenda
 
Top 10 Hubspot Development Companies in 2024
Top 10 Hubspot Development Companies in 2024Top 10 Hubspot Development Companies in 2024
Top 10 Hubspot Development Companies in 2024TopCSSGallery
 
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyes
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyesHow to Effectively Monitor SD-WAN and SASE Environments with ThousandEyes
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyesThousandEyes
 
Time Series Foundation Models - current state and future directions
Time Series Foundation Models - current state and future directionsTime Series Foundation Models - current state and future directions
Time Series Foundation Models - current state and future directionsNathaniel Shimoni
 
UiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to HeroUiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to HeroUiPathCommunity
 
Testing tools and AI - ideas what to try with some tool examples
Testing tools and AI - ideas what to try with some tool examplesTesting tools and AI - ideas what to try with some tool examples
Testing tools and AI - ideas what to try with some tool examplesKari Kakkonen
 
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better StrongerModern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better Strongerpanagenda
 
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotes
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotesMuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotes
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotesManik S Magar
 
React JS; all concepts. Contains React Features, JSX, functional & Class comp...
React JS; all concepts. Contains React Features, JSX, functional & Class comp...React JS; all concepts. Contains React Features, JSX, functional & Class comp...
React JS; all concepts. Contains React Features, JSX, functional & Class comp...Karmanjay Verma
 

Recently uploaded (20)

Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)
Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)
Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)
 
Accelerating Enterprise Software Engineering with Platformless
Accelerating Enterprise Software Engineering with PlatformlessAccelerating Enterprise Software Engineering with Platformless
Accelerating Enterprise Software Engineering with Platformless
 
A Journey Into the Emotions of Software Developers
A Journey Into the Emotions of Software DevelopersA Journey Into the Emotions of Software Developers
A Journey Into the Emotions of Software Developers
 
Irene Moetsana-Moeng: Stakeholders in Cybersecurity: Collaborative Defence fo...
Irene Moetsana-Moeng: Stakeholders in Cybersecurity: Collaborative Defence fo...Irene Moetsana-Moeng: Stakeholders in Cybersecurity: Collaborative Defence fo...
Irene Moetsana-Moeng: Stakeholders in Cybersecurity: Collaborative Defence fo...
 
Microservices, Docker deploy and Microservices source code in C#
Microservices, Docker deploy and Microservices source code in C#Microservices, Docker deploy and Microservices source code in C#
Microservices, Docker deploy and Microservices source code in C#
 
React Native vs Ionic - The Best Mobile App Framework
React Native vs Ionic - The Best Mobile App FrameworkReact Native vs Ionic - The Best Mobile App Framework
React Native vs Ionic - The Best Mobile App Framework
 
QCon London: Mastering long-running processes in modern architectures
QCon London: Mastering long-running processes in modern architecturesQCon London: Mastering long-running processes in modern architectures
QCon London: Mastering long-running processes in modern architectures
 
Kuma Meshes Part I - The basics - A tutorial
Kuma Meshes Part I - The basics - A tutorialKuma Meshes Part I - The basics - A tutorial
Kuma Meshes Part I - The basics - A tutorial
 
Zeshan Sattar- Assessing the skill requirements and industry expectations for...
Zeshan Sattar- Assessing the skill requirements and industry expectations for...Zeshan Sattar- Assessing the skill requirements and industry expectations for...
Zeshan Sattar- Assessing the skill requirements and industry expectations for...
 
Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...
Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...
Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...
 
Long journey of Ruby standard library at RubyConf AU 2024
Long journey of Ruby standard library at RubyConf AU 2024Long journey of Ruby standard library at RubyConf AU 2024
Long journey of Ruby standard library at RubyConf AU 2024
 
Why device, WIFI, and ISP insights are crucial to supporting remote Microsoft...
Why device, WIFI, and ISP insights are crucial to supporting remote Microsoft...Why device, WIFI, and ISP insights are crucial to supporting remote Microsoft...
Why device, WIFI, and ISP insights are crucial to supporting remote Microsoft...
 
Top 10 Hubspot Development Companies in 2024
Top 10 Hubspot Development Companies in 2024Top 10 Hubspot Development Companies in 2024
Top 10 Hubspot Development Companies in 2024
 
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyes
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyesHow to Effectively Monitor SD-WAN and SASE Environments with ThousandEyes
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyes
 
Time Series Foundation Models - current state and future directions
Time Series Foundation Models - current state and future directionsTime Series Foundation Models - current state and future directions
Time Series Foundation Models - current state and future directions
 
UiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to HeroUiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to Hero
 
Testing tools and AI - ideas what to try with some tool examples
Testing tools and AI - ideas what to try with some tool examplesTesting tools and AI - ideas what to try with some tool examples
Testing tools and AI - ideas what to try with some tool examples
 
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better StrongerModern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
 
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotes
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotesMuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotes
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotes
 
React JS; all concepts. Contains React Features, JSX, functional & Class comp...
React JS; all concepts. Contains React Features, JSX, functional & Class comp...React JS; all concepts. Contains React Features, JSX, functional & Class comp...
React JS; all concepts. Contains React Features, JSX, functional & Class comp...
 

Firefox OS Web APIs Guide

  • 2.
  • 4.
  • 5. Firefox OS Using HTML5, CSS and JavaScript together with a number of APIs to build apps and customize the UI.
  • 8.
  • 10. Web Content Certified Web App Regular web content Device-critical applications Installed Web App A regular web app Privileged Web App More access, more responsibility
  • 12. "permissions": { "contacts": { "description": "Required for autocompletion in the share screen", "access": "readcreate" }, "alarms": { "description": "Required to schedule notifications" } }
  • 13.
  • 14. Vibration API (W3C) Web Activities Screen Orientation Push Notifications API Geolocation API WebFM API Mouse Lock API (W3C) WebPayment Open WebApps IndexedDB (W3C) Network Information API (W3C) Ambient light sensor Battery Status API (W3C) Proximity sensor Alarm API Notification REGULAR APIS
  • 16. var battery = navigator.battery; if (battery) { var batteryLevel = Math.round(battery.level * 100) + "%", charging = (battery.charging)? "" : "not ", chargingTime = parseInt(battery.chargingTime / 60, 10, dischargingTime = parseInt(battery.dischargingTime / 60, 10); // Set events battery.addEventListener("levelchange", setStatus, false); battery.addEventListener("chargingchange", setStatus, false); battery.addEventListener("chargingtimechange", setStatus, false); battery.addEventListener("dischargingtimechange", setStatus, false); }
  • 18. var notification = navigator.mozNotification; notification.createNotification( "See this", "This is a notification", iconURL );
  • 20. // Portrait mode: screen.mozLockOrientation("portrait"); /* Possible values: "landscape" "portrait" "landscape-primary" "landscape-secondary" "portrait-primary" "portrait-secondary" */
  • 22. // Vibrate for one second navigator.vibrate(1000); // Vibration pattern [vibrationTime, pause,…] navigator.vibrate([200, 100, 200, 100]); // Vibrate for 5 seconds navigator.vibrate(5000); // Turn off vibration navigator.vibrate(0);
  • 24. var pay = navigator.mozPay(paymentToken); pay.onsuccess = function (event) { // Weee! Money! };
  • 26. var connection = window.navigator.mozConnection, online = connection.bandwidth > 0, metered = connection.metered;
  • 28. var alarmId1, request = navigator.mozAlarms.add( new Date("May 15, 2012 16:20:00"), "honorTimezone", { mydata: "my event" } ); request.onsuccess = function (event) { alarmId1 = event.target.result; }; request.onerror = function (event) { console.log(event.target.error.name); };
  • 29. var request = navigator.mozAlarms.getAll(); request.onsuccess = function (event) { console.log(JSON.stringify(event.target.result)); }; request.onerror = function (event) { console.log(event.target.error.name); };
  • 30. navigator.mozSetMessageHandler( "alarm", function (message) { // Note: message has to be set in the manifest file console.log("Alarm fired: " + JSON.stringify(message)); } );
  • 32. window.addEventListener("deviceproximity", function (event) { // Current device proximity, in centimeters console.log(event.value); // The maximum sensing distance the sensor is // able to report, in centimeters console.log(event.max); // The minimum sensing distance the sensor is // able to report, in centimeters console.log(event.min); });
  • 34. window.addEventListener("devicelight", function (event) { // The level of the ambient light in lux console.log(event.value); });
  • 35. window.addEventListener("lightlevel", function (event) { // Possible values: "normal", "bright", "dim" console.log(event.value); });
  • 36. window.addEventListener("devicelight", function (event) { // The lux values for "dim" typically begin below 50, // and the values for "bright" begin above 10000 console.log(event.value); });
  • 37. Device Storage API Browser API TCP Socket API Contacts API systemXHR PRIVILEGED APIS
  • 39. var deviceStorage = navigator.getDeviceStorage("videos");
  • 40. // "external", "shared", or "default". deviceStorage.type; // Add a file - returns DOMRequest with file name deviceStorage.add(blob); // Same as .add, with provided name deviceStorage.addNamed(blob, name); // Returns DOMRequest/non-editable File object deviceStorage.get(name); // Returns editable FileHandle object deviceStorage.getEditable(name); // Returns DOMRequest with success or failure deviceStorage.delete(name); // Enumerates files deviceStorage.enumerate([directory]); // Enumerates files as FileHandles deviceStorage.enumerateEditable([directory]);
  • 41. var storage = navigator.getDeviceStorage("videos"), cursor = storage.enumerate(); cursor.onerror = function() { console.error("Error in DeviceStorage.enumerate()", cursor.error.name); }; cursor.onsuccess = function() { if (!cursor.result) return; var file = cursor.result; // If this isn't a video, skip it if (file.type.substring(0, 6) !== "video/") { cursor.continue(); return; } // If it isn't playable, skip it var testplayer = document.createElement("video"); if (!testplayer.canPlayType(file.type)) { cursor.continue(); return; } };
  • 43. var contact = new mozContact(); contact.init({name: "Tom"}); var request = navigator.mozContacts.save(contact); request.onsuccess = function() { console.log("Success"); }; request.onerror = function() { console.log("Error") };
  • 45.
  • 46. { "activities": { "share": { "filters": { "type": ["image/png", "image/gif"] } "href": "sharing.html", "disposition": "window" } } }
  • 47. var activity = new MozActivity({ name: "view", data: { type: "image/png", url: ... } }); activity.onsuccess = function () { console.log("Showing the image!"); }; activity.onerror = function () { console.log("Can't view the image!"); };
  • 48.
  • 50.
  • 51. Resource lock API Spellcheck API UDP Datagram Socket API LogAPI Peer to Peer API Keyboard/IME API WebNFC WebRTC WebUSB FileHandle API HTTP-cache API Sync API Calendar API
  • 54. FIREFOX OS BOILERPLATE APP https://github.com/robnyman/Firefox-OS-Boilerplate-App
  • 56.
  • 57.
  • 58. var video = document.querySelector('video'); navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia; window.URL = window.URL || window.webkitURL || window.mozURL || window.msURL; // Call the getUserMedia method with our callback functions if (navigator.getUserMedia) { navigator.getUserMedia({video: true}, successCallback, errorCallback); } else { console.log('Native web camera streaming (getUserMedia) not supported in this browser.'); // Display a friendly "sorry" message to the user }
  • 59. function successCallback(stream) { // Set the source of the video element with the stream from the camera if (video.mozSrcObject !== undefined) { video.mozSrcObject = stream; } else { video.src = (window.URL && window.URL.createObjectURL(stream)) || stream; } video.play(); }
  • 61.
  • 62. https://lists.mozilla.org/listinfo/dev-webapps irc://irc.mozilla.org/ #openwebapps
  • 64.
  • 65.
  • 66.