Creating Applications with Mozilla
| resources: | Home Chapters Examples Figures Corrections Bugs Resources Mailing List Authors Reviews |
|---|
Figures
(click on images for larger version)
- xFly Logo
- Chapter 1
- Chapter 2
- Chapter 3
- Chapter 4
- Chapter 5
- Chapter 6
- Chapter 7
- Chapter 8
- Chapter 9
- Chapter 10
- Chapter 11
- Chapter 12
- Appendix
| xFly logo | |
|
Final xFly logo (illustrator file) |
| Chapter 1: Mozilla as Platform | |
|
Fig. 1-1: XPFE Framework (illustrator file -- moz_0101.ai) |
|
Fig. 1-2: Comparison of DHTML and XPFE (illustrator file -- moz_0102.ai) |
|
Fig. 1-3: ChatZilla, an IRC chat client created using Mozilla |
|
Fig. 1-4: The Mozilla browser rendering itself |
| Chapter 2: Getting Started | |
|
Fig. 2-1: The first Hello xFly example |
|
Fig. 2-2: The second Hello xFly example loaded in the browser |
|
Fig. 2-3: The second Hello xFly example launched in its own window |
|
Fig. 2-4: A Sample Package layout in the Directory System |
|
Fig. 2-5: xFly package directory structure |
|
Fig. 2-6: Modified shortcut properties |
| Chapter 3: XUL Elements and Features | |
|
Fig. 3-1: Preferences panel loaded as a page |
|
Fig. 3-2: Application Menubar |
|
Fig. 3-3: Visual comparison of menu widgets |
|
Fig. 3-4: Listbox |
|
Fig. 3-5: Multi-level Tree hierarchy |
|
Fig. 3-6: Autocomplete for Open Web Location |
|
Fig. 3-7: Checkbox Widget |
|
Fig. 3-8: Menu-button for browser's back functionality |
|
Fig. 3-9: Default box positioning |
|
Fig. 3-10: Box packing and alignment effects |
|
Fig. 3-11: Text stacked on an image |
|
Fig. 3-12: xFly Example Viewing Application |
| Chapter 4: Using CSS in Mozilla | |
|
Fig. 4-1: Scrollbars on Windows and on the Macintosh |
|
Fig. 4-2: The Open Web Location dialog in Windows and the Macintosh |
|
Fig. 4-3: The different states for buttons in the Modern theme |
|
Fig. 4-4: Composite Styles for the Reload Button |
|
Fig. 4-5: The contents of the modern.jar file |
|
Fig. 4-6: XUL File and Skin Loading |
|
Fig. 4-7: Classic and Modern Navigation Toolbars |
|
Fig. 4-8: Stylesheet additions to a XUL file |
|
Fig. 4-9: XUL Button with No Style |
|
Fig. 4-10: Modern Menubutton |
|
Image used in Table 4-1 |
|
Image used in Table 4-1 |
|
Image used in Table 4-1 |
|
Image used in Table 4-2 |
| Chapter 5: Scripting Mozilla | |
|
Fig. 5-1: Scripting in Mozilla (illustrator file -- moz_0501.ai) |
|
Fig. 5-2: Toggling the State of Menu Items in xFly |
|
Fig. 5-3: Event Capturing |
|
Fig. 5-4: How XPConnent fits into the applicaton model (illustrator file -- moz_0504.ai) |
| Chapter 6: Packaging and Installing Applications | |
|
Fig. 6-1: Mozilla Packaging Components |
|
Fig. 6-2: Package Interaction Overview |
|
Fig. 6-3: xFly Item in Tools Menu |
|
Fig. 6-4: Installation Process Overview |
|
Fig. 6-5: Simplest XPI Archive |
|
Fig. 6-6: Windows taskbar with Mozilla icon |
|
Fig. 6-7: Mozilla's splash screen |
| Chapter 7: Extending the UI with XBL | |
|
Fig. 7-1: Mozilla XUL Binding Structure |
|
Fig. 7-2: CSS binding attachment components |
|
Fig. 7-3: The |
| Chapter 8: XPCOM | |
| No images in chapter |
|
| Chapter 9: XUL Templates | |
|
Fig. 9-1: DOM Representation of XUL Template Generation |
|
Fig. 9-2: View of XUL tree in Mozilla |
|
Fig. 9-3: Listbox and Tree Template |
|
Fig. 9-4: Tree template with hyphen rule |
|
Fig. 9-5: Menubar template with menus |
| Chapter 10: RDF Content Model and Components | |
|
Fig. 10-1: Simple labeled directed graph |
|
Fig. 10-2: Resource to Literal Relationship |
|
Fig. 10-3: RDF Graph with five nodes |
|
Fig. 10-4: Namespaces applied to Figure 10-3 |
|
Fig. 10-5: The first statement of the graph, with labeled parts |
|
Fig. 10-6: The second statement of the graph, with labeled parts |
|
Fig. 10-7: The third statement of the graph, with labeled parts |
|
Fig. 10-8: The full graph |
|
Fig. 10-9: Diagram of Mozilla's Content Model |
| Chapter 11: Localization | |
|
Fig. 11-1: Localized menus in English and in Spanish |
|
Fig. 11-2: Locale's placement in typical chrome layout |
|
Chapter 12: Remote Applications |
|
|
Fig. 12-1: Distributed Remote Mozilla Application |
|
Fig. 12-2: Remote XUL File Accessing Skin |
|
Fig. 12-3: Hiss-zilla, a remote game |
|
Fig. 12-4: A Netscape Object Signing certificate chain |
|
Fig. 12-5:Downloading Certificate Window |
|
Fig. 12-6: Certificate Manager with a certs.mozdev.org CA Certificate |
|
Fig. 12-7: Signtool's processes for creating a signed application |
|
Fig. 12-8: Receiving a Signed Application |
|
Fig. 12-9: Snake game in full-screen mode on Windows |
|
Fig. 12-10: Result of using the GetScore function |
| Appendix images | |
|
Fig. A-1: Mozilla Cross Reference code browsing tool |
|
Fig. B-1: The DOM Inspector Interface |
|
Fig. B-2: An Interface Displayed in the Component Viewer |
|
Fig. B-3: The JavaScript Debugger |
|
Fig. B-4: Chrome view in Mozilla Translator |