o'reilly - creating applications with mozilla

Creating Applications with Mozilla Table of Contents Copyright Preface 1. Mozilla Background 2. The State of Mozilla 3. Who Should Read This Book 4. Platform and Applications 5. Structure of the Book 6. How This Book Was Written 7. Mozilla Licensing Information 8. Conventions 9. Comments and Questions 10. Acknowledgments 1. Mozilla as Platform 1.1. Visualizing Mozilla's Front End 1.1.1. XPFE Framework 1.1.2. Comparing XPFE and DHTML 1.1.3. Components of a Mozilla Application 1.2. Setting Up Your System 1.3. Mozilla Applications 1.3.1. Applications as Web Pages 2. Getting Started 2.1. Simple XUL Example 2.2. Basic XUL Concepts 2.2.1. The XUL File Format 2.2.2. Conventions 2.2.3. The XUL Namespace 2.2.4. Basic XUL Layout 2.2.5. Using XUL Windows 2.3. Making Mozilla Work for You 2.3.1. Importing Resources from Mozilla 2.4. Displaying XUL Files as Chrome 2.5. Creating a Package 2.5.1. Architecture of a Chrome Package 2.5.2. Package Components 2.5.3. Directory Structure 2.5.4. Package Manifests 2.5.5. Separating the Files 2.5.6. Registering a Package 2.6. Launching the Application 2.6.1. Windows launch 3. XUL Elements and Features 3.1. The XUL Document Object 3.1.1. XUL Parsing and the Document Object Model 3.2. Application Windows 3.2.1. Dialogs 3.2.2. Pages 3.2.3. Wizards 3.3. Application Widgets 3.3.1. The Toolbox 3.3.2. Selection Lists 3.4. Tabular and Hierarchical Information 3.4.1. List Boxes 3.4.2. High Performance Trees 3.4.3. Grid 3.5. Words and Pictures 3.5.1. Text Input 3.5.2. Text Display 3.5.3. Images 3.6. Form Controls 3.6.1. Radio 3.6.2. Checkbox 3.6.3. Buttons 3.7. Widget Interaction 3.7.1. Broadcaster and Observers 3.7.2. Commands 3.8. Content Panels 3.8.1. Browser and IFrame 3.8.2. Editor 3.9. The Box Model 3.9.1. Box Attributes 3.9.2. Box-Like Containers 3.9.3. Additional Box Features 3.9.4. Stacks and Decks 3.10. XUL Attributes 3.10.1. Stretchiness 3.10.2. Style 3.10.3. Persistence 3.10.4. The debug Attribute 3.11. Overlays 3.11.1. How to Use Overlays 3.11.2. Content Positioning 3.12. The Extras 3.12.1. Tooltips 3.12.2. Progress Meter 3.12.3. Links 3.13. Building the Application Shell 4. CSS in Mozilla Applications 4.1. Interface Basics 4.1.1. Skins Versus Themes 4.1.2. Limitations of a Skin 4.1.3. Theme Abstraction (or Building Good Skins) 4.1.4. Cross-Platform Interface Considerations 4.2. Introduction to CSS in Mozilla 4.2.1. Basic XUL + CSS Interaction 4.2.2. Stylesheet Syntax 4.2.3. Special Mozilla Extensions 4.2.4. Referencing Images in CSS 4.2.5. Menu Skinning 4.3. Mozilla Skins 4.3.1. CSS and Skin Hierarchies 4.3.2. Basic Skin Structure 4.3.3. The Modern and Classic Themes 4.3.4. Skin Files 4.4. Creating New Skins 4.4.1. Importing the Global Skin 4.4.2. Getting Started with Custom Styles 4.4.3. Creating Styles for the xFly Buttons 4.4.4. Describing the Skin in RDF 4.5. What Is Possible in a Skin? 4.5.1. Binding New Widgets to the Interface Using XBL 4.5.2. User Stylesheets 4.5.3. Theme Security Restrictions 5. Scripting Mozilla 5.1. Faces of JavaScript in Mozilla 5.2. JavaScript and the DOM 5.2.1. What Is the DOM? 5.2.2. The DOM Standards and Mozilla 5.2.3. DOM Methods and Properties 5.3. Adding Scripts to the UI 5.3.1. Handling Events from a XUL Element 5.3.2. Events and the Mozilla Event Model 5.3.3. Changing an Element's CSS Style Using JavaScript 5.3.4. Creating Elements Dynamically 5.3.5. Sharing Data Between Documents 5.4. XPConnect and Scriptable Components 5.4.1. What Is XPConnect? 5.5. JavaScript Application Code 5.5.1. JavaScript Libraries 6. Packaging and Installing Applications 6.1. Packaging and Installing Overview 6.2. Packaging Mozilla Applications 6.2.1. Package Manifests 6.2.2. Registering Packages 6.2.3. Creating a Package 6.2.4. The Chrome Registry 6.3. Installing Mozilla Applications 6.3.1. The XPI File Format 6.3.2. Installation Scripts 6.3.3. XPInstall 6.3.4. Uninstalling Applications 6.4. Finishing Things Up 6.4.1. Creating the xFly XPI 6.4.2. Adding the Installation Script 6.4.3. Web Page Installer 6.5. Extra Tricks for Customizing an Application 6.5.1. Icons 6.5.2. Splash Screen 7. Extending the UI with XBL 7.1. What Is XBL? 7.1.1. XBL Terminology 7.1.2. An XBL Document 7.1.3. Namespaces and XBL 7.1.4. XBL and HTML 7.2. Anatomy of a Binding 7.2.1. CSS Attachment 7.2.2. The XBL Content Element 7.2.3. The Implementation Element 7.2.4. Handlers 7.2.5. Style 7.3. Adding Behavior to Bindings 7.3.1. Binding Methods 7.3.2. Binding Properties 7.4. XBL and the DOM 7.4.1. The XBL DOM Interfaces 7.4.2. Binding Parents 7.4.3. Accessing Anonymous Nodes 7.4.4. Extra Binding Content and Insertion Points 7.5. Inheritance 7.5.1. Binding Inheritance 7.5.2. Attribute Inheritance 7.5.3. Implementation Inheritance 7.6. Event Handling 7.6.1. The Time and Venue 7.7. Resources for Bindings 7.7.1. Stylesheets in XBL 8. XPCOM 8.1. What Is XPCOM? 8.1.1. What Is a Component? 8.1.2. XPConnect and the Component Object 8.1.3. XPCOM Interfaces and the IDL 8.1.4. XPCOM Type Libraries 8.1.5. XPCOM Identifiers 8.1.6. Component Manager 8.1.7. Getting and Using XPCOM 8.2. Creating XPCOM Components 8.2.1. Creating a JavaScript XPCOM Component 8.2.2. Compiling the Component 8.2.3. Testing the Component 8.2.4. Useful C++ Macros and Types 8.2.5. C++ Implementation of nsISimple 8.2.6. The nsSimple module code 8.2.7. Other Languages for XPCOM 8.2.8. XPCOM as an Open Cross-Platform Solution 9. XUL Templates 9.1. Understanding XUL Templates 9.1.1. Basic template structure 9.2. Enhancing XUL Templates 9.2.1. Nested Content Sample 9.2.2. Using Data for Style 9.2.3. Tree Template 9.2.4. Multiple Rules Tree 9.2.5. Multiple Rules Menubar 9.3. Using Other XUL Tags for Templates 10. RDF, RDF Tools, and the Content Model 10.1. RDF Basics 10.1.1. RDF Data Model 10.1.2. RDF Syntax 10.1.3. Building an RDF File from Scratch 10.2. The Mozilla Content Model 10.2.1. Datasources 10.3. RDF Components and Interfaces 10.3.1. What Is an RDF Component? 10.3.2. What Are RDF Interfaces? 10.3.3. nsIRDFService 10.3.4. nsIRDFCompositeDataSource 10.3.5. nsIRDFDataSource 10.3.6. nsIRDFRemoteDataSource 10.3.7. nsIRDFPurgeableDataSource 10.3.8. nsIRDFNode, nsIRDFResource, and nsIRDFLiteral 10.3.9. nsIRDFContainerUtils 10.3.10. nsIRDFContainer 10.3.11. nsIRDFXML Interfaces 10.4. Template Dynamics 10.4.1. Template Dynamics in XBL 10.5. JSLib RDF Files 10.6. Manifests 10.6.1. RDF and Dynamic Overlays 11. Localization 11.1. Localization Basics 11.1.1. For the Developer 11.1.2. Files and File Formats 11.1.3. UI Aesthetics and Principles 11.2. DTD Entities 11.2.1. Inserting Entities 11.2.2. External and Inline Entities 11.3. String Bundles 11.3.1. Inside a Bundle 11.3.2. String Bundle Methods and Properties 11.3.3. Creating Your Own Bundle 11.4. Programming and Localization 11.4.1. Naming Conventions 11.4.2. Breaking Up the Text 11.4.3. Anonymous Content and Locale 11.4.4. Localizable Resources in HTML 11.4.5. Localizable Resources in RDF 11.5. The Chrome Registry and Locale 11.5.1. The Directory Structure 11.5.2. Interaction with the Chrome Registry 11.5.3. Distribution 11.6. Localization Issues 11.6.1. XPFE and Unicode 11.6.2. Language Quirks 12. Remote Applications 12.1. Directions in Remote Application Development 12.2. Basic Remote Application Example 12.2.1. Case Study: Snake (a.k.a. Hiss-zilla) 12.3. Setting Up XPFE for Remote Applications 12.3.1. Server Configuration 12.4. Generated Content 12.4.1. Generating Content with Scripting Languages 12.4.2. Generating Content from a Database 12.4.3. Localizing Remote Applications 12.5. Certificate Authorities and Digital Signatures 12.5.1. Mozilla Network Security Services (NSS) 12.5.2. CA Certificates, Signing Certificates, and the Certificate Chain 12.5.3. Setting Up a Certificate Authority 12.5.4. Issuing Signing Certificates 12.5.5. Distributing Distribution Certificates 12.6. Creating Signed Remote Applications 12.6.1. certs.mozdev.org CA Certificate 12.6.2. Signing Certificates 12.6.3. Creating and Signing the Application 12.6.4. Receiving a Signed Application 12.7. Expanded Privileges in Mozilla 12.8. Signed Remote Snake Game 12.8.1. How to Expand Mozilla to Full Screen 12.9. Mozilla's XML Extras and SOAP 12.9.1. Mozilla, SOAP, and .NET 12.9.2. Setting Up a .NET Web Service 12.9.3. .NET WSDL 12.9.4. SOAP Call XML Formats 12.9.5. Adding SnakeService SOAP to Snake 12.9.6. Make SOAP Functions Work in XUL Documents 12.9.7. Examining SOAP Functions for Snake 12.10. Looking Forward A. Getting and Building the Mozilla Source A.1. Getting the Source Code A.1.1. Downloading the Source with FTP A.1.2. Downloading the Source with CVS A.1.3. Working with Branching A.2. Building the Source Code A.2.1. Unix Environment A.2.2. Windows Environment A.2.3. Macintosh Environment B. Development Tools B.1. XULKit B.1.1. new-from-template.pl Script B.1.2. makexpi.pl Script B.1.3. Using XULKit B.2. Patch Maker 2.0 B.2.1. CVS Mode B.2.2. Build Mode B.3. The DOM Inspector B.4. The Component Viewer B.5. Venkman: The JavaScript Debugger B.6. MozillaTranslator B.7. Missing Parts B.7.1. Visual XUL Editors B.7.2. Toolkits and Libraries B.7.3. Integrating the Pieces C. Programmer's Reference C.1. XUL Element Set action Child element in a XUL template structure that draws content for matched data arrowscrollbox Container box for scrolling contents autorepeatbutton Provides arrows for a scrolling area binding Child element in a XUL template that optionally matches in the data bindings Substructure in a XUL template that collects the optional binding rules box Generic container and layout element broadcaster Notifies elements when a change occurs in the UI broadcasterset Container for broadcaster elements browser Web-content container button A widget that activates some functionality when pressed caption Provides heading for a groupbox element checkbox Indicates a specified feature's on/off state colorpicker Widget used to choose a color column A column in a grid columns Container for the number of columns in a grid command Defines functionality that can be called from multiple sources commands Container for a group of command sets commandset A container for multiple command elements conditions Defines the conditions within a template rule content Binds variables in a template deck Box container that displays one child element at a time description Holder for block of text that can wrap to multiple lines dialog Root element for secondary XUL window dialogheader Styled text heading for UI panel editor Content area for editable web content grid Widget for laying out content in a structured tabular fashion grippy Visible widget used on a grippy bar to expand or collapse a UI region groupbox Box with frame surrounding it hbox Box container whose children are laid out horizontally iframe Web content area image Display of a supported type image key Definition for a keyboard shortcut keybinding Container for a keyset or group of keysets keyset Container for one or more key elements label Simple text display element and label for a control element listbox Used for display of a flat list of items listcell Single cell of a listbox listcol Listbox column definition listcols Container for listbox columns (listcol) listhead Container for column header in list boxes (listheader) listheader Text header for listbox column listitem Listbox row definition member Matches container relationships in which the parent element is given by a container element and the child by a child element menu A menu element for containing menu items menubar Containing element for one or more menus menuitem Single selectable choice in a menu menulist Drop-down list of selectable items menupopup Pop-up container for menu items menuseparator Line separating menu items observes Broadcast event and attribute listener overlay Root element in a separate file that contains reusable XUL content page Root element of XUL file loaded in a content frame popup Box container as child window popupset Container for popup elements progressmeter Visual progress indicator of a time-consuming operation radio Single on/off choice represented as selectable circle radiogroup Framed box for containing radio elements resizer Window-resizing element row Container for grid cells laid out consecutively rows Definition for grid rows rule Defines rules for rendering data as XUL script Declaration of script used in XUL file scrollbar Widget for scrolling in a container scrollbarbutton Button used to move position of scrollbar thumb scrollbox Box for scrolling content separator Bar between elements slider A scrollbar without buttons spacer Blank space separating element splitter Element for dragging and resizing associated elements stack Shows children one on top of one another, all at the same time statusbar Box container for status elements statusbarpanel Single unit of a statusbar stringbundle Holder of localized properties for use in script stringbundleset Container for stringbundle elements tab A single selectable tab of a tabbox tabbox Box container for tab panels tabbrowser Tabbed holder for a set of web content views tabpanel A single panel of a tabbox tabpanels Container for tabpanel elements tabs Container for tab elements template A high-level widget used to build content dynamically from data textbox Accepts text input from user thumb Object used to move content in scrollable area toolbar Holder of buttons for quick-access UI functionality toolbarbutton Specially adapted button for use in a toolbar toolbarseparator Visible separator for elements contained in a toolbar toolbox Optional container for menu bars and toolbars tooltip Pop-up window for context-sensitive help tree Hierarchical holder of information represented as rows treecell A single cell in a tree treechildren The main body of a tree; a container for treeitems treecol A single column of a tree treecols Container for tree columns treeitem A treerow container treerow A single row of a tree triple Substructure of a template that matches RDF statements in the data vbox Box container with vertically laid out children window Root element of a top-level XUL window document wizard Window used to step though a task wizardpage A single panel (step) of a wizard C.2. XBL Element Set binding A single XBL binding bindings An XBL document's root element body Container for JavaScript code to be executed by an XBL method children Insertion point for children of a bound element, or inherited binding constructor Container for code to be executed when a binding is created content Container for anonymous content to be inserted into a bound document destructor Container for code to be executed when a binding is destroyed element Insertion point for bound elements in anonymous content field Holder property for simple data getter Script access point for an element's property handler Single event handler for an XBL element handlers Container for event-handler elements image An image resource in a binding implementation Container for binding methods and properties method Script function to be accessed on a binding object parameter Single paramter declaration for a method property Definition of a single binding object property resources Container for list of resources that can be used by a binding setter Change a binding property's value stylesheet Captures an external stylesheet for use by anonymous content C.3. Event Attributes onblur //FIXME purpose should go here onbroadcast //FIXME purpose should go here onchange //FIXME purpose should go here onclick //FIXME purpose should go here onclose //FIXME purpose should go here oncommand //FIXME purpose should go here oncommandupdate //FIXME purpose should go here oncontextmenu //FIXME purpose should go here oncreate //FIXME purpose should go here ondblclick //FIXME purpose should go here ondestroy //FIXME purpose should go here ondragdrop //FIXME purpose should go here ondragenter //FIXME purpose should go here ondragexit //FIXME purpose should go here ondraggesture //FIXME purpose should go here ondragover //FIXME purpose should go here onfocus //FIXME purpose should go here oninput //FIXME purpose should go here onkeydown //FIXME purpose should go here onkeypress //FIXME purpose should go here onkeyup //FIXME purpose should go here onload //FIXME purpose should go here onmousedown //FIXME purpose should go here onmousemove //FIXME purpose should go here onmouseout //FIXME purpose should go here onmouseover //FIXME purpose should go here onmouseup //FIXME purpose should go here onoverflow //FIXME purpose should go here [...]... package 2-1 5 Additions to the installed-chrome.txt file 3-1 XUL dialog 3-2 XUL page 3-3 A XUL wizard 3-4 Toolbar with buttons and spacing 3-5 Application menu bar 3-6 A sample menu 3-7 Context menu using pop up 3-8 XUL menu list 3-9 Listbox widget 3-1 0 Tree base model 3-1 1 Multilevel tree content view 3-1 2 XUL grid 3-1 3 Text autocomplete 3-1 4 A radio group choice of options 3-1 5 Shortcut keys with command... box with buttons as content 1 0-1 Simple RDF file with "fly" namespace 1 0-2 RDF root sequence 1 0-3 The Horse sequence 1 0-4 Entire RDF file 1 0-5 Content model of email datasources 1 0-6 RDF-specific components built into Mozilla 1 0-7 Creating a root node 1 0-8 Manipulating datasources 1 0-9 Parse an RDF/XML string into a datasource 1 0-1 0 Setup nsIRDFXMLSink with event handlers 1 0-1 1 Binding with in-memory... 6-3 xFly item in Tools menu 6-4 Installation process overview 6-5 Simplest XPI archive 6-6 Windows taskbar with Mozilla icon 6-7 Mozilla' s splash screen 7-1 Mozilla XBL binding structure 7-2 CSS binding attachment components 7-3 The inputfield alone in the XUL document 9-1 DOM representation of XUL template generation 9-2 View of XUL tree in Mozilla 9-3 Listbox and tree template 9-4 Tree template with. .. hyphen rule 9-5 Menubar template with menus 1 0-1 Simple labeled-directed graph 1 0-2 Resource to literal relationship 1 0-3 RDF Graph with five nodes 1 0-4 Namespaces applied to Figure 1 0-3 1 0-5 The first statement of the graph, with labeled parts 1 0-6 The second statement of the graph, with labeled parts 1 0-7 The third statement of the graph, with labeled parts 1 0-8 The full graph 1 0-9 Diagram of Mozilla' s... implementation 8-1 9 IDL for the Python component 8-2 0 Using the Python component in script 9-1 Simple XUL template in a listbox element 9-2 Basic structure of a XUL template 9-3 Hardcoded representation of generated XUL 9-4 XUL tree template in Figure 9-3 9-5 Simplified version of 1 0-4 RDF data 9-6 Tree template code of Figure 9-3 9-7 Tree template with rules 9-8 Menubar template with three rules 9-9 Template... code A-2 Windows environment variables used to build Mozilla A-3 Make flags B-1 Options for the new-from-template.pl script B-2 Options for the makexpi.pl script B-3 Patch Maker's CVS mode commands C-1 Common XUL element attributes List of Figures 1-1 XPFE framework 1-2 Comparison of DHTML and XPFE 1-3 ChatZilla, an IRC chat client created by using Mozilla 1-4 The Mozilla browser rendering itself 2-1 ... elements 1 1-6 Using the HTML break tag 1 1-7 Binding with attribute inheritance 1 1-8 RDF Description node with localizable text 1 1-9 The locale XPI install script, install.js 1 1-1 0 Locale-switching script 1 2-1 Remote XUL example 1 2-2 Enabling universal XPConnect 1 2-3 A sample static XUL file 1 2-4 Using PHP to generate the correct XUL MIME type 1 2-5 A simple Perl-generated XUL file 1 2-6 A Python-generated... command observers 3-1 6 Tabbed panels 3-1 7 A deck with three image layers 3-1 8 Deck layer switching 3-1 9 Content positioning in a stack 3-2 0 Flexible buttons 3-2 1 Positioning attributes 3-2 2 xFly application main workspace 3-2 3 Example tree in the xFly application 4-1 Class selector in CSS 4-2 Attribute selector in CSS 4-3 !important keyword in CSS 4-4 Image in CSS 4-5 Mixing CSS and XUL 4-6 CSS for print... template 1 0-1 2 Creating and modifying an RDF file using JSLib 1 0-1 3 Initialization 1 0-1 4 Data updating 1 0-1 5 Skin manifest 1 0-1 6 Overlay for a sample application menu 1 0-1 7 Overlay for an xFly menu item in the browser 1 1-1 XUL menu with entity references for text and accesskeys 1 1-2 The Editor's Doctype definitions 1 1-3 String bundles used by the Mozilla browser 1 1-4 Creating the bundle via XPConnect 1 1-5 ... reload button 4-5 The contents of the modern.jar file 4-6 XUL file and skin loading 4-7 Classic and Modern Navigation toolbars 4-8 Stylesheet additions to a XUL file 4-9 XUL button with no style 4-1 0 Modern menu button 5-1 Scripting in Mozilla 5-2 Toggling the state of menu items in xFly 5-3 Event capturing 5-4 How XPConnect fits into the application model 6-1 Mozilla packaging components 6-2 Package interaction . Next Creating Applications with Mozilla Preface Creating Applications with Mozilla Prev Next Preface Mozilla is not just a web browser. It is also a framework for building cross-platform applications. installed-chrome.txt file 3-1 . XUL dialog 3-2 . XUL page 3-3 . A XUL wizard 3-4 . Toolbar with buttons and spacing 3-5 . Application menu bar 3-6 . A sample menu 3-7 . Context menu using pop up 3-8 . XUL. generation 9-2 . View of XUL tree in Mozilla 9-3 . Listbox and tree template 9-4 . Tree template with hyphen rule 9-5 . Menubar template with menus 1 0-1 . Simple labeled-directed graph 1 0-2 . Resource