#firefoxos js-meetup

Post on 12-May-2015

185 Views

Category:

Technology

1 Downloads

Preview:

Click to see full reader

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/

top related