Changes

In a nutshell, Chrome is the user interface of Mozilla products. The user interface is composed mostly of [[XUL]], [[XBL]], CSS, and JS files. Extensions are (usually) chrome applets. 90% of You can make changes to these files without needing to recompile the Mozilla project you're working on - which is an [http://developer.mozilla.org/en/docs/Extensions extension]enormous timesaver, typically is chromeespecially for people who are just starting out on Mozilla-based development).

In If you look in the XUL worldchrome subdirectory of your installation, Chrome is you'll find .jar files - these contain the chrome files that make up the top level window which contains groups of UI elements of various typesuser interface. Example of chrome These jar files are the browser window and dialog windowactually just ZIP archives. The Extensions are (usually) chrome obtains its UI description from four types applets. 90% of providersan [http: //developer.mozilla.org/en/docs/Extensions extension], typically is chrome.

=More=Chrome URLs==To maximize the flexibility, Mozilla introduces a new technology called "Configurable Chrome" (Refer to [http://www.mozilla.org/xpfe/ConfigChromeSpec.html Configurable Chrome] by Benjamin Smedberg <benjamin@smedbergs.us>). A XUL file can be written in such a fashion that its chrome description comes from a mixture of physical sources, either locally, remotely, or a combination of both. An end user may customize her/his configuration to pick up any of the source type from his favor [[Chrome#Chrome_Providers|chrome providers]]. To achieve this, chrome type URLs must be used to reference external sources; such as CSS files and JavaScript files. A Chrome URL points to a file registered within the Mozilla product (it could be e-mail, calendar, browser etc.) The general form of chrome URLs look like this [Refer to [http://xulplanet.com/tutorials/xultu/chromeurl.html XULPlanet - The Chrome URL] for more details]: <pre>chrome://WindowType/ProviderType/[ProviderName/]</pre> *The "WindowType" is the window type of the chrome. Possible values are "navigator", "messenger", etc. The "ProviderType" is one of the four providers: content, skin, platform, or locale. Examples of the provider names, "ProviderName", are Mozilla, Mozillazine, xyzOrg, myISP, and etc. (Refer to [http://www.mozilla.org/projects/intl/iuc15/paper/iuc15xul.html XUL - Creating Localizable XML GUI] for illustrations).Below: Chrome registry - mapping chrome providers to URLs[[Image:Chrome.JPG]] 

The This aspect requires sufficient understanding of Chrome. Acoording to WierdAl (#developers), Firefox uses the toolkit approach: [http://developer.mozilla.org/en/docs/chrome registry is a file that lists each major Mozilla component and where in .manifest Chrome Registration - MDC] whereas SeaMonkey uses the old way (xpfe). ==Code Registry Example==<pre>1. content necko jar:comm.jar!/content/necko/ xpcnativewrappers=yes2. locale necko en-US jar:en-US.jar!/locale/en-US/necko/3. content xbl-marquee jar:comm.jar!/content/xbl-marquee/4. content pipnss jar:pipnss.jar!/content/pipnss/5. locale pipnss en-US jar:en-US.jar!/locale/en-US/pipnss/6. # Firefox-only7. overlay chrome directory its UI ://browser/content/pageInfo.xul chrome://pippki/content/PageInfoOverlay.xul application={ec8030f7-c20a-464f-9b0e-13a3a9e97384}8. overlay chrome://communicator/content/pref/preftree.xul chrome://pippki/content/PrefOverlay.xul9. overlay chrome://navigator/content/pageInfo.xul chrome://pippki/content/PageInfoOverlay.xul application=seamonkey@applications.mozilla.org10. content pippki jar:pippki.jar!/content/pippki/ xpcnativewrappers=yes11. locale pippki en-US jar:en-US.jar!/locale/en-US/pippki/12. content global-platform jar:toolkit.jar!/content/global-platform/ platform13. skin global classic/1.0 jar:classic.jar!/skin/classic/global/14. override chrome://global/content/netError.xhtml jar:embedder.jar!/global/content/netError.xhtml15. content inspector jar:inspector.jar!/content/inspector/ xpcnativewrappers=no</pre> *Line 1: <pre>content packagename uri/to/files are located/ [flags]</pre>**This code will register the package called necko when resolving the URL jar:comm. It is located in jar!/content/necko/ with the chrome directory itself and is xpcnativewrappers flag on   *Line 5: <pre>locale packagename localename uri/to/files/ [flags]</pre>**This code will register a locale package called either pinpnss with the localename en-US when resolving the URL jar:en-US.jar!/locale/en-US/pipnss/**NOTE: If there are more than one locale file register for the package, chromewill select the best-fit locale for the URL.rdf or installed *Line 6: <pre># this line is a comment -chrome.txt (or both)you can put whatever you want here</pre>**To comment your code, put '#' in the beginning of the line.

There are three basic types *Line 7: <pre>overlay chrome://URI-to-be-overlayed chrome://overlay-URI [flags]</pre>**The prupose of this code is to overlaying one chrome providers:on top of the other. The application={ec8030f7-c20a-464f-9b0e-13a3a9e97384} is a flag that specific which application will have this overlay.

The main source file for *Line 13: <pre>skin packagename skinname uri/to/files/ [flags]</pre>**This will register a window description comes from skin package gobal with the skinname classic/1.0 when resolving the content provider, and it can be any file type viewable from within MozillaURL jar:classic. It will typically be a XUL file, since XUL is designed jar!/skin/classic/global/**NOTE: If more than one skin register for describing the contents of windows and dialogs. The javascript files that define package, chrome will select the user interface are also contained within best-fit skin for the content packages, as well as most XBL binding filesURL.

Localizable applications keep all their localized information in locale providers*Line 14: <pre>override chrome://package/type/original-uri. This allows translators whatever new-resolved-URI [flags]</pre>**The purpose of this is to plug in override a different chrome package to translate an file provided by the application without altering the rest of the source code. The two main types of localizable files are DTD files and java-style properties filesor XULRunner with a new extension or embedder.

=What you can do =Starting Out==WierdAl in #developers said he started doing the development work by obtaining [http://www.gerv.net/software/patch-maker Gerv's Patch Maker] and looking in Bugzilla for a bug with the words "good first bug" in the Status Whiteboard. WierdAl also has a blog on his development: *[http://weblogs.mozillazine.org/weirdal/archives/cat_xul_widgets.html Burning Chrome: XUL Widgets Archives]*[http://weblogs.mozillazine.org/weirdal/archives/cat_xul_xbl_js_and_dom.html Burning Chrome: XUL, XBL, JS and DOM Archives] == Chrome Tutorials==Here are the following examples of what you can do with tutorials on how to create user interface parts using Chrome:

http://developer.mozilla.org/en/docs/Working_with_windows_in_chrome_code http://developer.mozilla.org/en/docs/Chrome_Registration [http://www.xulplanet.com/tutorials/xultu/chromeurlintro.html1.1 Introduction]