<div dir="ltr">Fantastic. I can&#39;t wait to use it in the next application. ;) <br><br>A 50% reduction of code is amazing. nice job<br><br>Cheers<br><br>Paul D. <br><br><div class="gmail_quote">On Thu, Sep 11, 2008 at 4:07 PM, Paul Spencer <span dir="ltr">&lt;<a href="mailto:pspencer@dmsolutions.ca">pspencer@dmsolutions.ca</a>&gt;</span> wrote:<br>
<blockquote class="gmail_quote" style="border-left: 1px solid rgb(204, 204, 204); margin: 0pt 0pt 0pt 0.8ex; padding-left: 1ex;">I thought I would give everyone a quick update on the status of my Jx update and a couple of other things.<br>

<br>
There are four topics to address:<br>
<br>
&nbsp;* the build process update<br>
&nbsp;* the Jx update<br>
&nbsp;* the new imagestrip generator<br>
&nbsp;* overall improvements from the above<br>
<br>
The Build Process<br>
=================<br>
<br>
The build process has been cleaned up a bit and the logic for building a single file build has been improved, now if you run ant compress it will produce a single file build for everything, unless you specify an appdef in which case it will include just what is required for that app (plus the json version of the appdef) - and compress the whole thing using YUI compressor. &nbsp;It is now simpler to build a compiled version of everything, which is ultimately what we want the default distribution to use.<br>

<br>
Jx<br>
==<br>
<br>
The Jx update is basically done except for some testing and a few minor quirks that I need to address. &nbsp;I have merged my changes from fusion/sandbox/jx2 into trunk today.<br>
<br>
Before you rush off to update, there are a couple of things to note:<br>
<br>
1) the Jx API has changed, which means if you are using Jx in your template (index.html) to create tabs, panels, dialogs etc then some things will need to be updated. &nbsp;I have updated the standard templates that ship with fusion in SVN (at least the mapserver one, I still have to check the mapguide one). &nbsp;I will send a separate email describing the major API changes.<br>

<br>
2) If you have created a custom skin for Jx (like the MapGuide templates), the CSS and images for those will need to be completely redone to match the new way we are doing things. &nbsp;I seriously doubt anyone has done this except for DMSG otherwise would have heard about it ;) so the impact should be small (except for the mapguide templates).<br>

<br>
A quick background on the Jx changes. &nbsp;The Jx update has been undertaken to achieve several goals (not all directly related to Fusion per se):<br>
<br>
1) reduce the size of the library by switching from Prototype/Scriptaculous to MooTools<br>
2) to standardize the Jx API and CSS files<br>
3) to simplify the internal construction of various objects - now many things share a common base class that provides the basic structure<br>
4) to simplify the process of creating a new visual skin for Jx<br>
5) reduce CPU usage by relying as much as possible on CSS and the browser&#39;s layout engine rather than javascript<br>
6) add some new features (such as menus that automatically adjust their position so they don&#39;t go off the page)<br>
7) add more visual effects (drop shadows, animations etc)<br>
<br>
We have largely achieved these goals, although we didn&#39;t get to adding any animation effects yet.<br>
<br>
The end result is a slimmer library (almost 50% reduction), a much cleaner code base and CSS, reduced CPU load, better memory management, etc.<br>
<br>
Bringing this code into Fusion, though, presented a couple of challenges. &nbsp;The mechanics of updating to use the new Jx API was relatively straight forward, but it highlighted a few things that I felt were pretty broken in the core architecture of how widgets are created and represented. &nbsp;I took the opportunity to revise this core architecture with the end result of simplifying widget creation and activation logic, simplifying the creation of new widgets (less to do for simple widgets), and completely removing four base classes (several hundred lines of code) that were just not necessary anymore. &nbsp;There is probably more that could be done with the core widget architecture but I am pretty satisfied with the work to date and don&#39;t plan to do any more at this time.<br>

<br>
Image Strip Generator<br>
=====================<br>
<br>
I have also added a new image strip generator (php command line script) that can be used to generate a single image and a CSS file from a set of icon images. &nbsp;These can be used by an application to cut out a large number of requests for individual icons in buttons and menu items. &nbsp;Here is how I used it on the MapServer standard template that comes with Fusion:<br>

<br>
1) in a command prompt, change directories to the images/icons directory in the application and run:<br>
<br>
$ /path/to/php /path/to/fusion/utils/imagestrip.php -css ../../icons.css -o ../icons.png *.png<br>
<br>
This generates a CSS file in the root directory of the application (it can go wherever you want) and a single image in the images directory<br>
<br>
2) edit the template index.html file and include the new CSS (after the jx skin CSS file)<br>
<br>
&lt;link rel=&quot;stylesheet&quot; href=&quot;icons.css&quot; type=&quot;text/css&quot; media=&quot;screen&quot; charset=&quot;utf-8&quot;&gt;<br>
<br>
3) edit the application definition and update all the widgets by changing the ImageUrl to point to the new icons.png file (yes all of them point to the same image) and setting the ImageClass to be the CSS class for that icon (which was taken from the file name)<br>

<br>
So if you had:<br>
<br>
 &nbsp; &nbsp; &nbsp;&lt;ImageUrl&gt;images/icons/zoom-in.png&lt;/ImageUrl&gt;<br>
 &nbsp; &nbsp; &nbsp;&lt;ImageClass/&gt;<br>
<br>
you would end up with:<br>
<br>
 &nbsp; &nbsp; &nbsp;&lt;ImageUrl&gt;images/icons.png&lt;/ImageUrl&gt;<br>
 &nbsp; &nbsp; &nbsp;&lt;ImageClass&gt;zoom-in&lt;/ImageClass&gt;<br>
<br>
my text editor has a regular expression search/replace feature that let me do it in one step:<br>
<br>
search for:<br>
 &nbsp; &nbsp; &nbsp;&lt;ImageUrl&gt;images/icons/(.*).png&lt;/ImageUrl&gt;<br>
 &nbsp; &nbsp; &nbsp;&lt;ImageClass/&gt;<br>
<br>
replace with:<br>
 &nbsp; &nbsp; &nbsp;&lt;ImageUrl&gt;images/icons.png&lt;/ImageUrl&gt;<br>
 &nbsp; &nbsp; &nbsp;&lt;ImageClass&gt;$1&lt;/ImageClass&gt;<br>
<br>
Combined Improvements<br>
=====================<br>
<br>
Old method, worst case: the default install, not compressed, load individual widget files:<br>
<br>
128 requests, 648 kb, 6.45 seconds<br>
<br>
New method (compressed, single file, image sprites for icons):<br>
<br>
52 requests, 254 kb, 4.3 seconds<br>
<br>
both methods are using gzip compression from the web server so the actual file sizes are larger in both cases, but I think this is a fair comparison.<br>
<br>
Also, there was a compressed build option for 1.0/1.1 which would have reduced the number of requests and size somewhat, bringing it a bit closer to the new method in terms of requests and size, although it doesn&#39;t have the image sprite capability for icons which means more requests and the new Jx is quite a bit slimmer (almost half the size because of the underlying library change from prototype to mootools).<br>

<br>
Overall, I am moderately happy that we have achieved the improvements we were looking for in this update (less HTTP requests, smaller overall file size, improved runtime performance) and have a few new features to play with.<br>

<br>
There will be a few more things coming for the next version including an optimization to the LoadMap process to allow faster initialization - the goal is to get a map on the page as quickly as possible, after all - and possibly the ability to generate sprites for legend images (we have a tentative version for mapserver, not sure if we will have a mapguide equivalent or not).<br>

<br>
Cheers<br>
<br>
Paul<br>
<br>
__________________________________________<br>
<br>
 &nbsp; Paul Spencer<br>
 &nbsp; Chief Technology Officer<br>
 &nbsp; DM Solutions Group Inc<br>
 &nbsp; <a href="http://www.dmsolutions.ca/" target="_blank">http://www.dmsolutions.ca/</a><br>
<br>
_______________________________________________<br>
fusion-dev mailing list<br>
<a href="mailto:fusion-dev@lists.osgeo.org" target="_blank">fusion-dev@lists.osgeo.org</a><br>
<a href="http://lists.osgeo.org/mailman/listinfo/fusion-dev" target="_blank">http://lists.osgeo.org/mailman/listinfo/fusion-dev</a><br>
</blockquote></div><br></div>