Difference between revisions of "How to do an application using XULRunner"

From CDOT Wiki
Jump to: navigation, search
(→‎Setting up the application.ini file)
(→‎References)
 
(9 intermediate revisions by the same user not shown)
Line 13: Line 13:
 
         prefs.js
 
         prefs.js
 
     application.ini
 
     application.ini
 +
 +
This file structure is used on a Linux platform.  If your using a different platform, please visit [http://developer.mozilla.org/en/docs/XULRunner:Deploying_XULRunner_1.8 Deploying XULRunner 1.8] to find the file struture for your specific platform.
  
 
'''Notes:'''
 
'''Notes:'''
Line 20: Line 22:
 
== Setting up the application.ini file ==
 
== Setting up the application.ini file ==
  
−
XULRunner first looks at the application.ini file.  This file contains configurations of how the application uses XULRunner.  which tells the application how it uses XULRunner.
+
XULRunner first looks at the application.ini file located at the root directory.  This file contains metadata which tells XULRunner how to run the application properly.  This fype typically contains [Heading] and Key=Values.  Also, Lines which begin with characters "#" or ";" are treated as comments.
  
−
== Setting up the chrome.manifestj file ==
+
The application.ini file contains two sections.  They are the following with surrounding square brackets:
  
 +
'''[App]''' Section - This section of the file contains data about the application
 +
<table style="width: 100%;" class="standard-table" cellborder=1 border=1 cellpadding=2 cellspacing=0>
 +
<tr>
 +
<td width="10%"> '''Key'''</td>
 +
<td> '''Value'''</td>
 +
</tr>
 +
<tr>
 +
<td>Name</td>
 +
<td>Name of the application.</td>
 +
</tr>
 +
<tr>
 +
<td>Version</td>
 +
<td>Version of the application.</td>
 +
</tr>
 +
<tr>
 +
<td>BuildID</td>
 +
<td>This is the build ID which is unique.  Typically this field is a date</td>
 +
</tr>
 +
<tr>
 +
<td>ID</td>
 +
<td>Unique ID of the application.</td>
 +
</tr>
 +
<tr>
 +
<td>Vendor</td>
 +
<td>This is the vendor of the application which is an optional field.</td>
 +
</tr>
 +
</table>
  
  
−
'''References:'''
+
'''[Gecko]''' Section - This section contains information about what version XULRunner is needed for the application.
−
*[http://blogs.acceleration.net/ryan/archive/2005/05/06/1073.aspx]
+
<table style="width: 100%;" class="standard-table" cellborder=1 border=1 cellpadding=2 cellspacing=0>
−
*[http://developer.mozilla.org/en/docs/Getting_started_with_XULRunner]
+
<tr>
−
*[http://developer.mozilla.org/en/docs/XULRunner:Deploying_XULRunner_1.8]
+
<td width="10%">'''Key'''</td>
 +
<td>'''Value'''</td>
 +
</tr>
 +
<tr>
 +
<td>MinVersion</td>
 +
<td>The minimum XULRunner version this application supports.</td>
 +
</tr>
 +
<tr>
 +
<td>MaxVersion</td>
 +
<td>The maximum XULRunner version this application can run on.</td>
 +
</tr>
 +
</table>
 +
 
 +
 
 +
The following is a sample '''application.ini''' file.
 +
 
 +
<pre>
 +
[App]
 +
Vendor=Mylau
 +
Name=Hello World Application
 +
Version=1.0
 +
BuildID=20060101
 +
Copyright=Copyright (c) 2006
 +
ID=xulTestApp@mylau.org
 +
 +
[Gecko]
 +
MinVersion=1.8
 +
MaxVersion=1.8
 +
</pre>
 +
 
 +
== Setting up the chrome.manifest file ==
 +
 
 +
The chrome manifest is used by XULRunner to locate the application resources.  The application can be distributed using a compressed JAR file.  For this example, the chrome.manifest file contains the following:
 +
 
 +
  content myapp file:content/
 +
 
 
== Setting up the prefs.js file ==
 
== Setting up the prefs.js file ==
  
 +
The prefs.js file tells XULRunner which XUL file contains the main window.  The following was used for this simple application.
 +
 +
pref("toolkit.defaultChromeURI", "chrome://myapp/content/main.xul");
 +
 +
 +
The '''pref''' function needs to be passed in two arguements.  In this scenario, this document provided an explaination on what those two arguements are:
 +
:*'''toolkit.defaultChromeURI''' is a preferences which allows a simple XULRunner-based application to open a new window
 +
:*'''chrome://myapp/content/main.xul''' is the location of the main XUL file.
  
 
== Creating some XUL ==
 
== Creating some XUL ==
  
 +
For the similicity of this application, we're going to create a simple XUL window that says hello world.
 +
 
 +
  <pre>
 +
  <?xml version="1.0"?>
 +
  <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
 +
 +
  <window id="main" title="My App" width="300" height="300"
 +
    xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
 +
    <caption label="Hello World"/>
 +
  </window>
 +
  </pre>
  
 
== Running the application ==
 
== Running the application ==
 +
 +
To run the application, type the following:
 +
 +
If your on Windows:
 +
  xulrunner.exe application.ini
 +
 +
If your on Linux:
 +
xulrunner application.ini
 +
 +
If your on Mac:
 +
  /Library/Frameworks/XUL.framework/xulrunner-bin application.ini
 +
 +
Make sure your in the application level of the XULRunner application.
 +
 +
== References ==
 +
*[http://blogs.acceleration.net/ryan/archive/2005/05/06/1073.aspx XULRunner Tutorial]
 +
*[http://developer.mozilla.org/en/docs/Getting_started_with_XULRunner Getting started with XULRunner]
 +
*[http://developer.mozilla.org/en/docs/XULRunner:Deploying_XULRunner_1.8 Deploying XULRunner]
 +
*[http://developer.mozilla.org/en/docs/XUL_Application_Packaging XUL Application Packaging]

Latest revision as of 21:18, 23 October 2006

Note: This page is still under construction

Setting up an application file structure

First set up the application file structure to the following: 

 /applicationName
   /chrome
     /applicationName
       your app files
     chrome.manifest
   /defaults
     /preferences
        prefs.js
   application.ini

This file structure is used on a Linux platform. If your using a different platform, please visit Deploying XULRunner 1.8 to find the file struture for your specific platform.

Notes:

Users can change the name of the italicized filename and folders

Setting up the application.ini file

XULRunner first looks at the application.ini file located at the root directory. This file contains metadata which tells XULRunner how to run the application properly. This fype typically contains [Heading] and Key=Values. Also, Lines which begin with characters "#" or ";" are treated as comments.

The application.ini file contains two sections. They are the following with surrounding square brackets:

[App] Section - This section of the file contains data about the application

Key Value
Name Name of the application.
Version Version of the application.
BuildID This is the build ID which is unique. Typically this field is a date
ID Unique ID of the application.
Vendor This is the vendor of the application which is an optional field.


[Gecko] Section - This section contains information about what version XULRunner is needed for the application.

Key Value
MinVersion The minimum XULRunner version this application supports.
MaxVersion The maximum XULRunner version this application can run on.


The following is a sample application.ini file. 

 [App]
 Vendor=Mylau
 Name=Hello World Application
 Version=1.0
 BuildID=20060101
 Copyright=Copyright (c) 2006 
 ID=xulTestApp@mylau.org
 
 [Gecko]
 MinVersion=1.8
 MaxVersion=1.8

Setting up the chrome.manifest file

The chrome manifest is used by XULRunner to locate the application resources. The application can be distributed using a compressed JAR file. For this example, the chrome.manifest file contains the following: 

 content myapp file:content/

Setting up the prefs.js file

The prefs.js file tells XULRunner which XUL file contains the main window. The following was used for this simple application. 

pref("toolkit.defaultChromeURI", "chrome://myapp/content/main.xul");


The pref function needs to be passed in two arguements. In this scenario, this document provided an explaination on what those two arguements are:

  • toolkit.defaultChromeURI is a preferences which allows a simple XULRunner-based application to open a new window
  • chrome://myapp/content/main.xul is the location of the main XUL file.

Creating some XUL

For the similicity of this application, we're going to create a simple XUL window that says hello world. 

  <?xml version="1.0"?>
  <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

  <window id="main" title="My App" width="300" height="300"
    xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
    <caption label="Hello World"/>
  </window>

Running the application

To run the application, type the following:

If your on Windows: 

 xulrunner.exe application.ini

If your on Linux: 

xulrunner application.ini

If your on Mac: 

 /Library/Frameworks/XUL.framework/xulrunner-bin application.ini

Make sure your in the application level of the XULRunner application.

References

Retrieved from "https://wiki.cdot.senecapolytechnic.ca/w/index.php?title=How_to_do_an_application_using_XULRunner&oldid=5644"