#firefoxos js-meetup
TRANSCRIPT
FIREFOX OS
Nagy Gergőgergo.istvan.nagy [at] mozilla [dot] huBudapest.js – javascript meetup2013.06.17.
Operating System
https://mdn.mozillademos.org/files/4605/FirefoxOS.png
Web Applications
+ Web APIs
Development
APIs
• for telephony• for device handling• for standard web development
What APIs are available for my application?
• Hosted application• Privileged apps• Certified apps
What is the situation with the camera?
Is there any way to get a photo with my application?
Application bus
MozActivities
Similar to Intents on Android
var activity = new MozActivity({ name: "pick", data: { type: "image/jpeg" }});
Custom activities to work together with third party apps!
https://github.com/daf182/moz-activity
Manifest files
appcache
open web app
appcache
cache.manifest
open web app
manifest.webapp
Three way of testing:
• Use a real phone• Use the simulator• Use the emulator (r2d2b2g)
The easiest way is the esimulator:
• available as simple Firefox Add-on• manifest file validation• remote debugging• remote console• push to device
Let's write the application!
Hello world!
Application development steps
• edit html and css files to create UI• implement application logic in javascript• write manifest for the OS• open your manifest in the simulator
<!DOCTYPE html><html> <head> <title>Hello meetup!</title> </head> <body> <h1>
Hello Budapest JS meetup! </h1>
</body></html>
{ "version": "0.1", "name": "HelloBPJS", "description": "Firefox OS Open Web App", "launch_path": "/index.html", "developer": { "name": "Gergo Nagy" },
"icons": { "60" : "/image/icons/icon-60.png"
}}
What about the stylessheets?
Documentation
Marketplace
Publication methods
• Hosted apps• Packaged apps
The final demo!
https://github.com/daf182/shake2bounce
Thanks for watching!
Links
https://github.com/mozilla/r2d2b2ghttps://developer.mozilla.org/en-US/docs/WebAPIhttps://developer.mozilla.org/en-US/docs/Web/Apps/App_permissions?redirectlocale=en-US&redirectslug=Apps%2FApp_permissionshttps://marketplace.firefox.com/developers/docs/quick_starthttps://marketplace.firefox.com/http://www.mozilla.org/en-US/styleguide/products/firefoxos/icons/http://buildingfirefoxos.com/