webapis & apps - mozilla london
TRANSCRIPT
![Page 1: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/1.jpg)
WebAPIs & AppsFIREFOX OS
![Page 2: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/2.jpg)
![Page 3: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/3.jpg)
![Page 4: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/4.jpg)
![Page 5: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/5.jpg)
![Page 7: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/7.jpg)
![Page 8: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/8.jpg)
Using HTML5, CSS and JavaScript together with a number of APIs to build apps and customize the UI.
![Page 9: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/9.jpg)
![Page 10: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/10.jpg)
https://addons.mozilla.org/firefox/addon/firefox-os-simulator/
![Page 11: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/11.jpg)
Droid@Screenhttp://blog.ribomation.com/droid-at-screen/
![Page 12: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/12.jpg)
Open Web Apps
![Page 13: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/13.jpg)
Web apps are apps built using standard Web technologies. They work in any modern Web browser.
The Open Web apps project proposes some small additions to existing sites to turn them into apps.
These apps run on desktop browsers and mobile devices.
![Page 14: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/14.jpg)
https://developer.mozilla.org/docs/Apps/Getting_Started
![Page 15: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/15.jpg)
![Page 16: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/16.jpg)
Steps to Take
![Page 17: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/17.jpg)
![Page 18: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/18.jpg)
Develop Web App using HTML5, CSS, & Javascript1.
Create an app manifest file2.
Publish/install the app3.
![Page 19: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/19.jpg)
1. Develop Web App using HTML5, CSS & JavaScript
![Page 20: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/20.jpg)
Reuse any existing web site/app or develop from scratch with open web standards.
Utilize HTML5 features such as localStorage, offline manifest, IndexedDB and access Web APIs for more options.
Responsive web design for adapting to varying resolutions and screen orientation.
![Page 21: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/21.jpg)
![Page 22: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/22.jpg)
2. Create an app manifest file
![Page 23: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/23.jpg)
Create a file with a .webapp extension
![Page 24: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/24.jpg)
{ "version": "1.0", "name": "MozillaBall", "description": "Exciting Open Web development action!", "icons": { "16": "/img/icon-16.png", "48": "/img/icon-48.png", "128": "/img/icon-128.png" }, "developer": { "name": "Mozilla Labs", "url": "http://mozillalabs.com" }, "installs_allowed_from": ["*"], "appcache_path": "/cache.manifest", "locales": { "es": { "description": "¡Acción abierta emocionante del desarrollo del Web!", "developer": { "url": "http://es.mozillalabs.com/" } }, "it": { "description": "Azione aperta emozionante di sviluppo di fotoricettore!", "developer": { "url": "http://it.mozillalabs.com/" } } }, "default_locale": "en"}
![Page 26: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/26.jpg)
Serve with Content-type/MIME type:
application/x-web-app-manifest+json
![Page 27: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/27.jpg)
Apache - in mime.types:
application/x-web-app-manifest+json webapp
Apache - in .htaccess:
AddType application/x-web-app-manifest+json webapp
NGinx - in mime.types:
types { text/html html htm shtml; text/css css; text/xml xml; application/x-web-app-manifest+json webapp;}
![Page 28: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/28.jpg)
IIS:
In IIS Manager, right-click the local computer, and click Properties.
Click the MIME Types button.
Click New.
In the Extension box, type the file name extension.
In the MIME type box, type a description that exactly matches the file type defined on the computer.
Click OK.
![Page 29: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/29.jpg)
curl -I http://mozillalabs.com/manifest.webapp
![Page 30: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/30.jpg)
3. Publish/install the app
![Page 31: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/31.jpg)
Firefox Marketplace
![Page 32: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/32.jpg)
https://marketplace.firefox.com/
![Page 33: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/33.jpg)
https://marketplace.firefox.com/developers/
![Page 34: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/34.jpg)
Installing/hosting the app
![Page 35: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/35.jpg)
var request = navigator.mozApps.install( "http://mozillalabs.com/MozillaBall.webapp", { user_id: "some_user" });
request.onsuccess = function() { // Success! Notification, launch page etc}
request.onerror = function() { // Failed. this.error.name has details}
![Page 36: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/36.jpg)
var request = navigator.mozApps.installPackage( "http://mozillalabs.com/manifest.webapp");
request.onsuccess = function() { // Success!}
request.onerror = function() { // Failed.}
![Page 37: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/37.jpg)
Packaged vs. Hosted Apps
![Page 38: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/38.jpg)
A packaged app is an Open Web App that has all of its resources (HTML, CSS, JavaScript, app manifest, and so on) contained in a zip
file, instead of having its resources on a Web server.
A packaged app is simply a zip file with the app manifest in its root directory. The manifest must be named manifest.webapp.
![Page 39: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/39.jpg)
Can be privileged apps with more API access than hosted apps
Special protocol internal to the zip file: app://<uuid>
Manifest file must be named manifest.webapp
Resources are accessed from the zip file, which is stored on the device where the app is installed
Installed with a different mozApps API function: installPackage()
Enforce a specific Content Security Policy for all application content
Can embed remote content in iframes, but that content will not have access to privileged APIs nor will it have the default CSP applied to it
Have an update process for getting new versions of the app to users. Hosted apps do not need this process.
![Page 40: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/40.jpg)
https://developer.mozilla.org/docs/Apps/For_Web_developers
![Page 41: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/41.jpg)
WebAPIs
![Page 42: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/42.jpg)
The Mozilla WebAPI team is pushing the envelope of the web to include --- and in places exceed --- the capabilities of competing stacks.
![Page 43: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/43.jpg)
https://wiki.mozilla.org/WebAPI
![Page 44: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/44.jpg)
Security Levels
![Page 45: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/45.jpg)
Granted by default
Safe web APIs that don’t expose privacy sensitive data. WebGL, fullscreen, audio, etc.
Granted by user
location, camera, file system access
Granted when installed
No quota for localStorage, IndexedDB, offline cache
Granted by authorized store
Privacy and security sensitive APIs such as Contacts API
Verified by signature
Highly privileged APIs such as radio access (dialer)
![Page 46: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/46.jpg)
Web Content
Regular web content
Installed Web App
A regular web app
Privileged Web App
More access, more responsibility
Certified Web App
Device-critical applications
![Page 47: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/47.jpg)
https://wiki.mozilla.org/WebAPI#Planned_for_initial_release_of_B2G_.
28aka_Basecamp.29
![Page 48: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/48.jpg)
"permissions": { "contacts": { "description": "Required for autocompletion in the share screen", "access": "readcreate" }, "alarms": { "description": "Required to schedule notifications" }}
![Page 49: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/49.jpg)
AlarmAPI
BrowserAPI
Contacts
device-storage:music/device-storage:videos/device-storage:pictures/device-storage:sdcard:
Add, read, or modify files stored at a central location on the device. access property required: one of readonly, readwrite, readcreate, or createonly.
FMRadio
geolocation
systemXHR
TCP Socket API
wake-lock-screen
NEED PERMISSION
![Page 51: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/51.jpg)
Vibration API (W3C)
Screen Orientation
Geolocation API
Mouse Lock API (W3C)
Open WebApps
Network Information API (W3C)
Battery Status API (W3C)
Alarm API
Web Activities
Push Notifications API
WebFM API
WebPayment
IndexedDB (W3C)
Ambient light sensor
Proximity sensor
Notification
REGULAR APIS
![Page 52: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/52.jpg)
BATTERY STATUS API
![Page 53: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/53.jpg)
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); }
![Page 54: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/54.jpg)
NOTIFICATION
![Page 55: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/55.jpg)
var notification = navigator.mozNotification;notification.createNotification( "See this", "This is a notification", iconURL);
![Page 56: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/56.jpg)
SCREENORIENTATION API
![Page 57: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/57.jpg)
// Portrait mode:screen.mozLockOrientation("portrait");
/* Possible values: "landscape" "portrait" "landscape-primary" "landscape-secondary" "portrait-primary" "portrait-secondary"*/
![Page 58: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/58.jpg)
VIBRATION API
![Page 59: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/59.jpg)
// Vibrate for one secondnavigator.vibrate(1000);
// Vibration pattern [vibrationTime, pause,…]navigator.vibrate([200, 100, 200, 100]);
// Vibrate for 5 secondsnavigator.vibrate(5000);
// Turn off vibrationnavigator.vibrate(0);
![Page 60: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/60.jpg)
WEB PAYMENTS
![Page 61: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/61.jpg)
var pay = navigator.mozPay(paymentToken);pay.onsuccess = function (event) { // Weee! Money!};
![Page 62: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/62.jpg)
![Page 63: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/63.jpg)
NETWORK INFORMATION API
![Page 64: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/64.jpg)
var connection = window.navigator.mozConnection, online = connection.bandwidth > 0, metered = connection.metered;
![Page 65: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/65.jpg)
ALARM API
![Page 66: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/66.jpg)
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);};
![Page 67: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/67.jpg)
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);};
![Page 68: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/68.jpg)
navigator.mozAlarms.remove(alarmId1);
![Page 69: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/69.jpg)
navigator.mozSetMessageHandler( "alarm", function (message) { // Note: message has to be set in the manifest file console.log("Alarm fired: " + JSON.stringify(message)); });
![Page 70: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/70.jpg)
{ "messages": ["alarm"]}
![Page 71: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/71.jpg)
DEVICEPROXIMITY
![Page 72: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/72.jpg)
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);});
![Page 73: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/73.jpg)
AMBIENT LIGHT EVENTS
![Page 74: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/74.jpg)
window.addEventListener("devicelight", function (event) { // The level of the ambient light in lux console.log(event.value);});
![Page 75: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/75.jpg)
window.addEventListener("lightlevel", function (event) { // Possible values: "normal", "bright", "dim" console.log(event.value);});
![Page 76: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/76.jpg)
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);});
![Page 77: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/77.jpg)
Device Storage API
Browser API
TCP Socket API
Contacts API
systemXHR
PRIVILEGED APIS
![Page 78: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/78.jpg)
DEVICE STORAGE API
![Page 79: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/79.jpg)
var deviceStorage = navigator.getDeviceStorage("videos");
![Page 80: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/80.jpg)
// "external", "shared", or "default".deviceStorage.type;
// Add a file - returns DOMRequest with file namedeviceStorage.add(blob);
// Same as .add, with provided namedeviceStorage.addNamed(blob, name);
// Returns DOMRequest/non-editable File objectdeviceStorage.get(name);
// Returns editable FileHandle objectdeviceStorage.getEditable(name);
// Returns DOMRequest with success or failuredeviceStorage.delete(name);
// Enumerates filesdeviceStorage.enumerate([directory]);
// Enumerates files as FileHandlesdeviceStorage.enumerateEditable([directory]);
![Page 81: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/81.jpg)
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; }};
![Page 82: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/82.jpg)
CONTACTS API
![Page 83: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/83.jpg)
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")};
![Page 84: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/84.jpg)
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
CERTIFIED APIS
![Page 85: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/85.jpg)
WEBTELEPHONY
![Page 86: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/86.jpg)
// Telephony objectvar tel = navigator.mozTelephony;
// Check if the phone is muted (read/write property)console.log(tel.muted);
// Check if the speaker is enabled (read/write property)console.log(tel.speakerEnabled);
![Page 87: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/87.jpg)
// Place a callvar cal = tel.dial(“123456789”);
![Page 88: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/88.jpg)
// Receiving a calltel.onincoming = function (event) { var incomingCall = event.call;
// Get the number of the incoming call console.log(incomingCall.number);
// Answer the call incomingCall.answer();};
// Disconnect a callcall.hangUp();
// Iterating over calls, and taking action depending on their changed statustel.oncallschanged = function (event) { tel.calls.forEach(function (call) { // Log the state of each call console.log(call.state); });};
![Page 89: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/89.jpg)
WEBSMS
![Page 90: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/90.jpg)
// SMS objectvar sms = navigator.mozSMS;
// Send a messagesms.send("123456789", "Hello world!");
![Page 91: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/91.jpg)
// Recieve a messagesms.onreceived = function (event) { // Read message console.log(event.message);};
![Page 92: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/92.jpg)
WEB ACTIVITIES
![Page 93: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/93.jpg)
![Page 94: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/94.jpg)
{ "activities": { "share": { "filters": { type: ["image/png", "image/gif"], } "href": "sharing.html", "disposition": "window" } }}
![Page 95: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/95.jpg)
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!");};
![Page 96: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/96.jpg)
var register = navigator.mozRegisterActivityHandler({ name: "view", disposition: "inline", filters: { type: "image/png" }});
register.onerror = function () { console.log("Failed to register activity");}
![Page 97: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/97.jpg)
navigator.mozSetMessageHandler("activity", function (a) { var img = getImageObject(); img.src = a.source.url; // Call a.postResult() or a.postError() if // the activity should return a value});
![Page 98: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/98.jpg)
![Page 99: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/99.jpg)
Future APIs
![Page 100: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/100.jpg)
![Page 101: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/101.jpg)
Resource lock API
UDP Datagram Socket API
Peer to Peer API
WebNFC
WebUSB
HTTP-cache API
Calendar API
Spellcheck API
LogAPI
Keyboard/IME API
WebRTC
FileHandle API
Sync API
![Page 102: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/102.jpg)
Web Apps from Mozilla
![Page 103: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/103.jpg)
![Page 104: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/104.jpg)
Dialer
Contacts
Settings
SMS
Web browser
Gallery
Video Player
Music Player
E-mail (POP, IMAP)
Calendar
Alarm Clock
Camera
Notes
First Run Experience
Notifications
Home Screen
Mozilla Marketplace
System Updater
Localization Support
![Page 106: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/106.jpg)
https://hacks.mozilla.org/2013/01/hacking-gaia-for-firefox-os-part-1/
![Page 107: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/107.jpg)
Installing apps
![Page 108: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/108.jpg)
FIREFOX OS BOILERPLATE APP
https://github.com/robnyman/Firefox-OS-Boilerplate-App
![Page 109: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/109.jpg)
FXOSSTUB
https://hacks.mozilla.org/2012/12/fxosstub-a-minimalists-working-example-of-the-design-guide-rules-for-firefox-os/
![Page 110: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/110.jpg)
MORTAR
https://hacks.mozilla.org/2013/01/writing-web-apps-quickly-with-mortar/
![Page 111: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/111.jpg)
Getting help
![Page 112: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/112.jpg)
![Page 113: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/113.jpg)
irc://irc.mozilla.org/#openwebapps
![Page 114: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/114.jpg)
https://lists.mozilla.org/listinfo/dev-webapps
![Page 115: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/115.jpg)
Trying things out
![Page 116: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/116.jpg)
![Page 117: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/117.jpg)
![Page 118: WebAPIs & Apps - Mozilla London](https://reader031.vdocuments.mx/reader031/viewer/2022013100/55495a2db4c905fc4e8b550f/html5/thumbnails/118.jpg)