Obiettivi

• Conoscere le caratteristica della community di sviluppo legata al progetto Mozilla e gli strumenti e modalità di collaborazione utilizzate
• Conoscere le fonti di Documentazioni ufficiali e i libri pubblicati sull’argomento
• Conoscere l’architettura e le componenti principali dell’application framework Mozilla
• Conoscere la struttura/componenti di una semplice estensione/applicazione basata sul framework Mozilla
• Conoscere le base del linguaggio di markup XUL
• Conoscere gli strumenti di sviluppo utilizzabili sulla piattaforma Mozilla

Mozilla Application Framework II

• An High Level View of a Firefox Extension
• Chrome Overlays
• XPCOM Components and Services
• FUEL

An High Level View of a Firefox Extension (1/2)

Le estensioni per Firefox sono realizzate con le stesse tecnologie con cui è sviluppato Firefox stesso (e lo stesso vale per le estensioni delle altre applicazioni realizzate con la Mozilla Platform)

Una estensione è costituita da un insieme di script e di file che ne descrivono l’UI, il suo stile e i suoi comportamenti.

Opzionalmente una estensione può comprendere dei nuovi XPCOM components (realizzati in C++, in Javascript o in un’altro dei linguaggi di cui esiste un binding XPCOM)

Di solito le estensioni vengono distribuite in archivi con estensione XPI (che altro non è se non un archivio in formato ZIP delle risorse che compongono un estensione)

An High Level View of a Firefox Extension (2/2)

• https://developer.mozilla.org/en/Bundles

  .mozilla/firefox/ti4eg136.default/extensions/helloext@alcacoop.it/ 
  	chrome.manifest
  	install.rdf
  	chrome
  	    content
  		helloext.xul
  		helloext.js
  		browserOverlay.xul
  	    skin
  	        helloext.css
  	components
  	defaults
  	locale
  	  en-US
  		helloext.dtd
  		helloext.properties
  	  it-IT
  

install.rdf

<?xml version="1.0"?>
<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
     xmlns:em="http://www.mozilla.org/2004/em-rdf#">
  <Description about="urn:mozilla:install-manifest">
    <em:id>helloext@alcacoop.it</em:id>
    <em:version>0.0001</em:version>
    <em:type>2</em:type>
    <!-- Firefox -->
    <em:targetApplication>
      <Description>
        <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
        <em:minVersion>1.5</em:minVersion>
        <em:maxVersion>3.1.*</em:maxVersion>
      </Description>
    </em:targetApplication>
    <em:name>HelloExt</em:name>
    <em:description>Hello Mozilla Firefox Extensions world!!!</em:description>
    <em:creator>Luca Greco</em:creator>
    <em:iconURL>chrome://firebug/content/helloext.png</em:iconURL>
    <em:homepageURL>http://labs.alcacoop.it/docs/MozillaPlatform/helloext</em:homepageURL>
  </Description>
</RDF>

Install MetaData

Il file install.rdf contiene i metadata dell’estensione necessari alle funzionalità di installazione estensioni integrati nella piattaforma Mozilla.

https://developer.mozilla.org/en/Install_Manifests

OBBLIGATORI

• id dell’addon (es. helloext@alcacoop.it oppure un UUID generato) [view on mdc]
• versione dell’addon (es. 0.203a5) [view on mdc]
• tipo di addon (es. 2 → Extension, 4 → Tema, 8 → Locale…) [view on mdc]
• le applicazioni supportate (ad es. Firefox, Thunderbird) [view on mdc] [moz appversions]
• il nome dell’addon (es. HelloExt) [view on mdc]

chrome.manifest

content helloext chrome/content/
skin	helloext classic/1.0	skin/
locale  helloext en-US       locale/en-US/
locale  helloext fr-FR       locale/fr-FR/
locale  helloext it-IT       locale/it-IT/

overlay chrome://browser/content/browser.xul chrome://helloext/content/browserOverlay.xul

Chrome Registration

La Chrome Registration consiste nel caricamento da parte di Firefox (o di un altra applicazione Mozilla-based) del file chrome.manifest dell’applicazione/estensione e nella conseguente registrazione degli url configurati nel suddetto manifest.

• https://developer.mozilla.org/en/Chrome_Registration

Esistono diverse tipologie di istruzioni del Manifest :

• content registra degli url per l’accesso ai contenuti di un estensione del tipo chrome://helloext/content/ (xul, javascript, immagini etc.) [view on mdc]
• overlay effettua il chromeoverlay tra uno XUL master document e un XUL overlay [view on mdc]
• locale registra gli url virtuali di accesso ai file .dtd e .properties di localizzazione [view on mdc]

Chrome Overlays

Come identificare il punto in cui agganciare il nostro overlay?

• DOMinspector ( opzionalmente con il supporto di InspectorWidget )
• Attraverso l’uso di MXR
• Attraverso l’uso di ChromeList

Firefox Extension Development Environment (1/3)

Allo scopo di velocizzare e semplificare lo sviluppo di un estensione per Firefox (ma molto spesso si può utilizzare la stessa tecnica anche per lo sviluppo di applicazioni più complesse basate sulla Mozilla Platform) è utile creare un profilo di sviluppo e l’installazione di estensioni utili durante lo sviluppo:

• Extensions Developer Extension
  • ci permette di riavvia chrome senza dover riavviare firefox
  • imposta alcune configurazioni utili durante lo sviluppo (abilita il debug su console e disabilità il caching dei documenti XUL provenienti da chrome)
• ChromeList
  • ci consente di verificare quali url sono effettivamente stati registrati su chrome ed il loro contenuto
• XPCOMViewer
  • consente di navigare i componenti e servizi XPCOM e le interfacce fornite

Firefox Extension Development Environment (2/3)

• Console^2
  • consente di visualizzare e filtrare più efficacemente i log
• InspectorWidget
  • consente di effettuare l’inspect mediante click sul componente di interesse e visualizzazione tramite DOMinspector
• MozREPL
  • consenti di interagire con l’istanza Mozilla di sviluppo

Firefox Extension Development Environment (3/3)

Durante lo sviluppo è inoltre utile evitare laboriose procedure di pacchettizzazione e reinstallazione dell’estensione in sviluppo.

A questo scopo è possibile operare una shadow installation creando un file di testo nella directory delle estensioni con l’id del nostro addon come dichiarato nell’ install.rdf (es. FXPROFILEDIR/extensions/helloext@alcacoop.it ) il cui contenuto dovrà essere il path assoluto della directory contenente i nostri sorgenti.

NOTA: le estensioni possono contenere raggruppamenti di intere sezioni all’interno di archivi jar e di puntarne il contenuto mediante opportuni url nel file chrome.manifest , durante lo sviluppo è preferibile non utilizzare questa caratteristiche per evitare inutili pacchettizzazioni intermedie.

XPCOM Components and Services (1/3)

• XPCOM è una tecnologia CORBA-like, basata sulla descrizione di interfacce mediante IDL e binding multilinguaggio. [view on Wikipedia]
• XPCOM Interfaces descrivono le caratteristiche degli oggetti (attributi e metodi) e sono indipendenti dalla loro implementazione.
• XPCOM Components sono l’implementazione di una o più interfacce.
• XPCOM Services sono speciali componenti di cui può esistere una sola implementazione, in altre parole si tratta di componenti singleton .

https://developer.mozilla.org/en/XUL_Tutorial/XPCOM_Interfaces

XPCOM Components and Services (2/3)

XPCOM Component example from MDC

function copyFile(sourcefile,destdir)
{
  // get a component for the file to copy
  var aFile = Components.classes["@mozilla.org/file/local;1"]
    .createInstance(Components.interfaces.nsILocalFile);
  if (!aFile) return false;

  // get a component for the directory to copy to
  var aDir = Components.classes["@mozilla.org/file/local;1"]
    .createInstance(Components.interfaces.nsILocalFile);
  if (!aDir) return false;

  // next, assign URLs to the file components
  aFile.initWithPath(sourcefile);
  aDir.initWithPath(destdir);

  // finally, copy the file, without renaming it
  aFile.copyTo(aDir,null);
}

copyFile("/mozilla/testfile.txt","/etc");

XPCOM Components and Services (3/3)

XPCOM Service example from MDC

var bmarks = Components.classes["@mozilla.org/browser/bookmarks-service;1"].getService();
bmarks.QueryInterface(Components.interfaces.nsIBookmarksService);
bmarks.addBookmarkImmediately("http://www.mozilla.org","Mozilla",0,null);

FUEL

A partire da Firefox 3 la piattaforma è stata dotata di una nuova API Javascript (realizzata in XPCOM/Javascript) che ha lo scopo di fornire una interfaccia di utilità per gli sviluppatori di estensioni per Firefox, minimizzando i formalismi derivanti da XPCOM.

https://developer.mozilla.org/en/FUEL

FUEL – Application

Il punto di ingresso dell’API FUEL è disponibile di solito attraverso la variabile globale Application.

Nel caso in cui non fosse disponibile nel nostro contesto, è possibile istanziarla esplicitamente mediante XPCOM:

var Application = Components.classes["@mozilla.org/fuel/application;1"]
			    .getService(Components.interfaces.fuelIApplication);

FUEL – Objects

Tra le funzionalità più importanti di FUEL abbiamo l’accesso ai Bookmark, alle Preference, Window e BrowserTab :