Mozilla XUL Part 1


XUL cross-platform language for describing applications’ user interfaces.
XUL (pronounced "zool" and rhyming with "cool") was created to make development of the Mozilla browser easier and faster.

What can be done using XUL ?

  • Input controls such as textboxes and checkboxes
  • Toolbars with buttons or other content
  • Menus on a menu bar or pop up menus
  • Tabbed dialogs
  • Trees for hierarchical or tabular information
  • Keyboard shortcuts

How can XUL be used ?

  • Firefox extension
  • Standalone XULRunner application
  • XUL package
  • Remote XUL application

You should have an understanding of HTML and at least a basic understanding of XML and CSS.

Tools Needed

Recommended
   Mozilla Firefox 3.6
    XULRunner 1.9.2
Upgrade
    Mozilla Firefox 4b
    XULRunner 2
Guidelines to keep in mind.
  • XUL elements and attributes should all be entered in lowercase as XML is case-sensitive (unlike HTML).
  • Attribute values in XUL must be placed inside quotes, even if they are numbers.
  • XUL files are usually split into four files, one each for the
    • layout and elements,
    • for style declarations,
    • for entity declarations (used for localization)
    • for scripts.
    • In addition, you may have extra files for images or for platform specific data.

Chrome

This chrome package registration is the way Firefox extensions are able to add features to the browser. The extensions are small packages of XUL files, JavaScript, style sheets and images packed together into a single file .zip

The extension will hook into the browser using a XUL specific feature called an overlay which allows the XUL from the extension to mesh with the XUL in the browser.

‘ chrome:// ‘  URL always refers to installed packages and extensions.

Types of document in Mozilla:

HTML, XML, and XUL.

Types of chrome providers:

  • Content. Content can consist of any file type viewable from within Mozilla. In particular, the content provider most often consists of a set of XUL, JavaScript and XBL binding files.
  • Locale. Translations for multi-language support. The two main types of files are DTD files and java-style properties files.
  • Skin. The skin provider provides complete appearance data for the user interface. Consisting of CSS files and images.
Content Packages
browser.jar
content
browser
browser.xul
browser.js
— other browser XUL and JS files goes here —
bookmarks
— bookmarks files go here —
preferences
— preferences files go here —

Skins or Themes

classic.jar:
skin
classic
browser
browser.css
— other browser skin files go here —
global
— global skin files go here —

Global dialogs and definitions.

toolkit.jar

basic syntax of the lines in the manifest file for content packages is:

‘content <packagename> <filepath>’
browser.manifest file used by Firefox looks like this:
content branding jar:browser.jar!/content/branding/ xpcnativewrappers=yes
content browser jar:browser.jar!/content/browser/ xpcnativewrappers=yes
overlay chrome://global/content/viewSource.xul chrome://browser/content/viewSourceOverlay.xul
overlay chrome://global/content/viewPartialSource.xul chrome://browser/content/viewSourceOverlay.xul
overlay chrome://browser/content/pageInfo.xul chrome://pippki/content/PageInfoOverlay.xul
Two packages are listed here, ‘branding’ and ‘browser’. Three overlays are also specified,

Create jar

jar:<filename.jar>!/<path_in_archive>

CLICK HERE Source Code for mozilla XUL

Leave a comment