Developing for the FirefoxOS

        {
          "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

          function ambientCallback(ambient) {
              // do something with ambient.value
          }
          window.addEventListener('devicelight', 
                                  ambientCallback, false);
        

Hosted
stored on your server, easy to upgrade, limited access

Privileged
reviewed by the App store, packaged and signed

Certified
part of the OS, only for Mozilla and partners

Security model

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

        var call = new MozActivity({
          name: "dial",
          data: {
            number: "+1804100100"
          }
        });
      

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

        getphoto.onsuccess = function () {
          var img = document.createElement("img");
          img.src = window.URL.createObjectURL(this.result.blob);
          body.appendChild(img);
        };
        getphoto.onerror = function () { // error
        };
      

Using App Manager

Go into settings and
Device Information > More Information > Developer
Switch on the Remote debugging

Linux users should also configure udev rule

adb logcat | grep JS

App designer website

Add a component

        <x-flipbox>
          <div>I'm the front face.</div>
          <div>And I'm the back face.</div>
        </x-flipbox>
      

Brick website

Use extended element in Javascript

        toggleButton.addEventListener("click", function(){
          flipBox.toggle(); 
        });
      

Brick website

Firefox Marketplace

• Navigate to Marketplace for developers
• Click on Submit an app
• Provide hosted app URL or upload a zip
• Fill in the details
• Wait for approval, you can also change data and upload new versions.

        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
        };
        

• app calls navigator.mozPay() using signed JWT
• Buyer logs-in, enters her PIN
• app receives a callback
• app server receives a signed POST request
• You receive money directly deposited to your bank account

In-app payments API

• Piotr Zalewa
• Senior Web Developer
• Twitter: @zalun
• Slides: bit.ly/fxos-smartdevcon