• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Front in recife
 

Front in recife

on

  • 836 views

 

Statistics

Views

Total Views
836
Views on SlideShare
836
Embed Views
0

Actions

Likes
0
Downloads
5
Comments
1

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel

11 of 1 previous next

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
  • E mais barato que o PS4 kkkkk
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Front in recife Front in recife Presentation Transcript

    • Front In! RECIFE #FirefoxOS !
    • Fábio Magnoni @FabioMagnoni #FirefoxOS
    • http://www.unrealengine.com/html5/
    • GONK GECKO GAIA
    • GONK
    • Infrastructure Layer (Gonk) Open Source Libraries RILd
 GPS Input / Touch
 Audio / Video Open GLES
 Accel
 Power Mgt
 Bluetooth
 LEDs HW Buttons
 Vibrator
 USB
 Camera
 Device’s Operationg System Linux Kernel OEM Drivers OEM Modem Firmware OEM Libs
    • GECKO
    • Open Web Platform Interface Web APIs Contacts
 Security Camera Media Storage WebRTC
 Settings WebTelephony WebSMS/MMS
 Sensors GeoLocation Battery Vibration
 Open Web
 Apps APIs
 NFC Bluetooth
 Network
 Connections / UICC
 Gecko Engine System XHR
 mozPay /
 Trusted
 UI
 Alarms System Messages
 Web
 Activities
 HTML5 APIs
    • GAIA
    • Application Layer HTML5 / JS / CSS Gaia JS Libraries
 For Developers Core Certified Apps
 Hosted Apps
 System App
 Utility Libraries Building Blocks
 Trusted Packed Apps

    • Construindo Apps
    • Apps Web Aberta
    • A Web é a Plataforma
    • Mobile Internet Users Desktop
    • Plataformas !
    • A Web está ganhando!!!
    • {
 "version": "1.0",
 "name": “Mozilla ",
 "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/"
 }
 },
 "pt-BR": {
 "description": "Descrição da sua aplicação!",
 "developer": {
 "url": "http://pt-BR.mozillalabs.com/"
 }
 }
 },
 "default_locale": "en"
 }

    • Verificador de Manifesto http://appmanifest.org/
    • Empacotadas vs. Hospedadas
    • Segurança
    • Apps Conteúdo Web Web Apps Privilegiadas Conteúdos Web Padrão Mais acesso, mais responsabilidade Web Apps Instaladas Web App Certificada Web App Normal Apps Críticas ao dispositivo
    • Permissões https://developer.mozilla.org/en-US/Apps/Developing/App_permissions
    • "permissions": {
 "contacts": {
 "description": "Required for autocompletion in the share screen",
 "access": "readcreate"
 },
 "alarms": {
 "description": "Required to schedule notifications"
 }
 }
    • WEB APIs
    • WEB APIS (PRA GALERA) 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
    • API STATUS DA BATERIA
    • 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); }
    • NOTIFICAÇÃO
    • var notification = navigator.mozNotification;
 notification.createNotification(
 "See this", 
 "This is a notification", 
 iconURL
 );
    • API ORIENTAÇÃO DE TELA
    • // Portrait mode:
 screen.mozLockOrientation("portrait");
 
 /* 
 Possible values:
 "landscape" 
 "portrait"
 "landscape-primary"
 "landscape-secondary"
 "portrait-primary"
 "portrait-secondary"
 */
    • API VIRAÇÃO
    • // 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);
    • API INFO DE REDE
    • var connection = window.navigator.mozConnection,
 online = connection.bandwidth > 0,
 metered = connection.metered;

    • PROXIMIDADE
    • 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);
 });
    • API EVENTOS ILUMINAÇÃO
    • window.addEventListener("devicelight", function (event) {
 // The level of the ambient light in lux
 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);
 });
    • WEB APIS (PRIVILEGIADAS) Device Storage API Browser API TCP Socket API Contacts API systemXHR
    • DEVICE STORAGE
    • 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;
 }
 };
    • API DE CONTATO
    • var addContact = document.querySelector("#add-contact");
 if (addContact) { 
 addContact.onclick = function () {
 var newContact = new MozActivity({
 name: "new", // Possibly add-contact in future versions
 data: {
 type: "webcontacts/contact",
 params: { // Will possibly move to be direct properties under "data"
 giveName: "Fabio",
 familyName: "Magnoni",
 tel: "+5519988013586",
 email: "fabio@mozilla.com",
 address: "Campinas",
 note: “Se tiver cerveja envolvida, pode entrar em contato :)”,
 company: "Mozilla"
 }
 }
 });
 }
 }
    • Apps Certificadas = Apps SO
    • 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
    • WEB ACTIVITIES
    • 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!");
 };
    • {
 "activities": {
 "share": {
 "filters": {
 "type": ["image/png", "image/gif"]
 }
 "href": "sharing.html",
 "disposition": "window"
 }
 }
 }
    • var register = navigator.mozRegisterActivityHandler({
 name: "view", 
 disposition: "inline", 
 filters: {
 type: "image/png"
 }
 });
 
 register.onerror = function () {
 console.log("Failed to register activity");
 }
    • 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
 });
    • Como instalar App da Web var install app = navigator.mozApps.install(manifestURL);
 installapp.onsucess = function(data) { //App is installed
 }; 
 installapp.onerror = function() { //App wasn’t installed, info is in // installapp.error.name };
    • APIs Futuras
    • 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
    • https://marketplace.firefox.com/
    • o/ Documentos e Ferramentas o/
    • FIREFOX OS BOILERPLATE APP https://github.com/robnyman/Firefox-OS-Boilerplate-App
    • https://addons.mozilla.org/firefox/addon/firefox-ossimulator/
    • http://buildingfirefoxos.com/
    • https://developer.mozilla.org/en-US/docs/WebAPI
    • https://marketplace.firefox.com/developers/
    • Mozilla Developer Blog https://hacks.mozilla.org/category/firefox-os/
    • http://mozilla.github.io/brick/docs.html
    • Componentes Appbar ! Calendar ! Deck ! Flipbox ! Layout ! Slideshow ! Slider ! Tabbar ! Toggle ! Tooltip
    • App Maker https://appmaker.mozillalabs.com/
    • Pedindo Ajuda
    • https://lists.mozilla.org/listinfo/dev-webapps irc://irc.mozilla.org/ #openwebapps
    • Fábio Magnoni fabio@mozilla.com @FabioMagnoni @mozhacks