1
edit
Changes
→To Do
[http://jsdoodnauth.wordpress.com/2008/11/25/how-to-read-files-in-xul/ Reading Files in XUL]<br />
[http://jsdoodnauth.wordpress.com/2008/11/26/xul-file-io-write-files/ Writing Files in XUL]
==== The File Picker ====
One of the goals of this packager is for it to be platform independent. By using the File Picker, not only does it make it easy for the end-user to select the location of their application, but nsIFilePicker will return a platform specific path to the program.
function openDirDialog()
{
const nsIFilePicker = Components.interfaces.nsIFilePicker;
var fp = Components.classes["@mozilla.org/filepicker;1"]
.createInstance(Components.interfaces.nsIFilePicker);
fp.init(window,”Select Directory”,nsIFilePicker.modeGetFolder);
var ret = fp.show();
if (ret == nsIFilePicker.returnOK || ret == nsIFilePicker.returnReplace)
{
applicationPath = fp.file.path;
document.getElementById(’tb_inputPath’).value = applicationPath;
}
}
There are different modes which the File Picker can operate which can be found [http://www.xulplanet.com/references/xpcomref/ifaces/nsIFilePicker.html here]
==== The Wizard ====
In a push to get the UI to work with the program, I looked into XUL wizards. When I think about it, there is really only two buttons to push, one to load the app directory location, and the other to package the app, it's just a matter of doing it in the right order to get an output file. After a talk with Dave Humphrey a while back, he put it into my head that I should make it a wizard, which is essentially what my program is.<br />
Creating a wizard in XUL, is really a matter of knowing what you want the user to enter for each step, and then making a wizard page for it.
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<wizard id="example-window" title="My First Wizard"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<wizardpage>
<description>
This is my first wizard"
</description>
<label value="What do you want to know?"/>
<menulist>
<menupopup>
<menuitem label="How to make a wizard"/>
<menuitem label="How to make a wizard page"/>
<menuitem label="All about XUL"/>
</menupopup>
</menulist>
</wizardpage>
<wizardpage description="This second wizard page">
<label value="Anything else to it?"/>
</wizardpage>
</wizard>
For XRap however, I wanted separate pages for each platform, depending on what the user is working on. Especially since packaging for Mac can only be done on a Mac, and cross packaging for Linux and Windows is quite buggy right now. Its the best solution to keep them separate. I used the 'navigator.platform' on the first wizard page to filter the platform, and direct the user the platform specific second wizard page. The second page will be where the app actually gets packaged. Finally the third page is just a generic Packaging completed page.
* I recently got some feedback on my blog, that I should add a button to open the location for where the package was created. I'll definitely add this for my next release!
----
===Windows Development- [http://wix.sourceforge.net/ WiX]=======Creating a Basic WiXfile====WiX begins with a fairly simple XML file, which will once compiled and linked will generate an msi installer. That's if you want to create an installer for your target users just to click and install completely automatically. The WiX file is labelled with a .wxs extension and has this XML schema: <?xml version='1.0' encoding='windows-1252' ?> <Wix xmlns='http://schemas.microsoft.com/wix/2006/wi'> <Product Name='FooBar' Id='ADD A GUID' Language='1033' Codepage='1252' Version='1.0.0' Manufacturer='Zoo'> <Package Id='DIFFERENT GUID' Keywords='Installer' Description='Zoo 1.0' Comments='None' InstallerVersion='100' Languages='1033' SummaryCodepage='1252'/> <Media Id='1' Cabinet='Sample.cab' EmbedCab='yes' DiskPrompt="CD-ROM #1" /> <Property Id='DiskPrompt' Value="Zoo Installer [1]" /> <Directory Id='TARGETDIR' Name='SourceDir' > <Directory Id='ProgramFilesFolder' Name'PFiles'> <Directory Id='Foo' Name='Foo'> <Directory Id='INSTALLDIR' Name='FooBar' LongName='FooBarApplication'> <Component Id='MainExecutable' Guid='A DIFFERENT GUID'> <File Id='FooBar.exe' Name='FooBar.exe' LongName='FooBarApplication.exe' DiskId='1' Source=...> <Shortcut /> </File> </Component> ...-> MULTIPLE COMPONENTS CONTAINING FILES </Directory> </Directory> </Directory> <Directory Id='ProgramMenuFolder' Name='PMenu' LongName='Programs'> <Directory Id='ProgramMenuDir' Name='FooBar' LongName... /> </Directory> <Directory Id='DesktopFolder' Name='Desktop' /> </Directory> <Feature Id='Complete' Level='1'> <ComponentRef Id='MainExecutable' /> ...-> ONE COMPONENTREF FOR EACH COMPONENT FROM ABOVE </Feature> <Icon Id='FooBar.exe' SourceFile='FooBarApp.exe' /> </Product> </Wix>This a very rough layout of the file, for a complete tutorial visit: [http://www.tramontana.co.hu/wix/ WiX Tutorial] ====WiX Tools====The main tools that most users will use:*candle.exe**is the Wix Compiler**which takes the .wxs creates a .wixobj*light.exe**is the Wix Linker**takes the .wixobj and creates a .msi *dark.exe**is a Wix decompiler**taking the .msi back to a wxs source file There is a great diagram of all of the Wix tools here: [http://wix.sourceforge.net/ coretoolset.html WiXToolset]<br />
== Project Plan ==
* December 13, 2008
** XRap v0.3 for Windows is Released
* January 14, 2009
** Studied the WiX Tutorial and Documentation on how to implement the UI features
* January 15, 2009
** Built some sample applications to see how the various UI's are implemented, and how the custom Bitmaps and Licenses are applied to the installers
** Started applying the changes to the XRap UI
* January 19, 2009
** Edited the generators of the .wxs and .wixobj WiX files, to accommodate the new UI
** So far the only problem is that the customizable installer will need to keep track of certain files which can be optionally installed
* February 11, 2009
** Completed Linux Packaging
** Using Autotools, managed to get Makefiles created, and tarballed the application directory
** End user will now be able to use 'make install' to install application to /usr/bin directory
* February 15, 2009
** Had to change how I used some of the autotools, need to execute them using scripts, because they are not reading the correct directory
** Completed the scripts, but the tools still don't seem to work
* February 16, 2009
** Implemented the nsIFilePicker dialog to get the application's directory path from the user
* February 17, 2009
** Started to merge my Windows and Linux releases
** Kept the Javascript in their two different files
** Refactored the Windows javascript to handle files and folders in a cross-platform manner (by using the append() method from the nsIFile interface)
* February 22, 2009
** Continued refactoring the Windows code, trying to get it to work on Linux
** Attempting to have some common variables in the javascript, so that the two files can work with it.
==Releases==
</tr>
<tr>
<td>0.5</td>
<td>[http://matrix.senecac.on.ca/~jsdoodna/XRap/0-5/XRap.tar XRap v0.5 Installer and Source]</td>
</tr>
<tr>
<td>0.6</td>
<td>[http://osdn.dl.sourceforge.net/sourceforge/xrap/XRap_v0-6.zip XRap v0.6 Source]</td>
</tr>
</table>
* <strike>Clean up code</strike>
* <strike>Do some validation</strike>
* 0.8
** Merge completed Mac packaging into XRap
** Create a log file, storing:
*** all output from status box
*** guid's created
*** errors
** Mac
*** get correct package name from application.ini
* 0.9
** Add icon support in Wix script
** Windows
*** zip files for Mac and Linux distro and add script to run '--install-app' for each
** Linux
*** zip files for Mac distro and add script to run '--install-app'
** Mac
*** zip file for Linux distro and add script to run '--install-app'
==External Links==