| | 1 | = Practical Introduction to Fusion = |
| | 2 | |
| | 3 | == Description == |
| | 4 | |
| | 5 | The Practical Introduction to Fusion was a lab given by Julien-Samuel Lacroix and Yewondwossen Assefa at the FOSS4G 2008 in Cape Town, South Africa. It includes a quick introduction to Fusion and an application that evolve as the lab go on. Attendies of all technical level are aimed by this presentation as it contains really simple example and more complex ones. |
| | 6 | |
| | 7 | Once the application is installed, the first few slides will present Fusion and its core components. The real exercises begin at the slide labeled ''Map widget''. From there there's one slide per exercise. |
| | 8 | |
| | 9 | The lab index.html page contains links to the 8 steps of the lab. One could modify the first page (page1.html) along the way and end up with the equivalent of the last page in the end. The other option would be to simply look at the code to get the general idea. |
| | 10 | |
| | 11 | == Instructions == |
| | 12 | |
| | 13 | While doing the lab, you can always go to the corresponding HTML or XML page to see the end result or to copy/paste some code. The first slide correspond to page1.html and ApplicationDefinition1.xml, the second slide to page2.html and ApplicationDefinition2.xml and so on... |
| | 14 | |
| | 15 | The lab begins at the slide titled ''Map widget''. |
| | 16 | |
| | 17 | 1. Open the page1.html and the ApplicationDefinition.xml file |
| | 18 | 1. Change the Id of the Map div and the name of the !MapWidget accordingly[[BR]] |
| | 19 | `Test your application`[[BR]]`Change slide to Navigator` |
| | 20 | 1. Add the Navigator widget in the ApplicationDefinition.xml |
| | 21 | 1. Add the Navigator Div in your HTML page[[BR]] |
| | 22 | `Test your application`[[BR]]`Change slide to Map Navigation` |
| | 23 | 1. Add the Pan, !ZoomInFixed, !ZoomOutFixed and !ZoomInRectangle widget in your ApplicationDefinition.xml (See ApplicationDefinition3.xml for a reference) |
| | 24 | 1. Add the corresponding Div in you HTML page (See page3.html)[[BR]] |
| | 25 | 1. Add the jxskin-border.css CSS in your page[[BR]] |
| | 26 | `Test your application`[[BR]]`Change slide to Container` |
| | 27 | 1. Copy the toolbar widget from ApplicationDefinition4.xml |
| | 28 | 1. Replace the button Divs by a single Toolbar Div[[BR]] |
| | 29 | `Test your application`[[BR]]`Change slide to Legend` |
| | 30 | 1. Add a Legend widget in the XML file and a Div in your HTML[[BR]] |
| | 31 | `Test your application`[[BR]]`Change slide to Query` |
| | 32 | 1. Add a Selection and !SelectionPanel in your ApplicationDefinition.xml (Copy from ApplicationDefinition6.xml) |
| | 33 | 1. Add the Selection widget in your Toolbar widget definition (in ApplicationDefinition.xml) |
| | 34 | 1. Add the !SelectionPanel Div in your HTML[[BR]] |
| | 35 | `Test your application`[[BR]]`Change slide to Custom selection results` |
| | 36 | 1. Here, it may be better to simply take the page7.html file. The version of fusion used is not the same and there's a lot of code to copy. |
| | 37 | 1. Add the Extension tag in your !SelectionPanel widget definition |
| | 38 | 1. Modify the displaySelection() !JavaScript function (in page7.html) to display more information. Currently it only display the Park name, change it to display the Area as well[[BR]] |
| | 39 | `Test your application`[[BR]]`Change slide to Custom legend` |
| | 40 | 1. Use page8.html to make sure you import the new !JavaScript functions |
| | 41 | 1. Add the Extension tag in your Legend widget definition |
| | 42 | 1. Modify the !VerySimpleLegend() !JavaScript function to make it nicer[[BR]] |
| | 43 | `Test your application`[[BR]]`Change slide, that was the last exercise` |
| | 44 | |
| | 45 | == Installation == |
| | 46 | |
| | 47 | __If don't have a Fusion installed:__[[BR]] |
| | 48 | Install MS4W [http://www.maptools.org/ms4w/index.phtml MS4W]. |
| | 49 | Extract foss4g08_fusionlab_ms4w.zip at the root of your MS4W installation. |
| | 50 | |
| | 51 | __If you already have a Fusion installed:__[[BR]] |
| | 52 | To install this lab, you need to have a working Fusion installation with MapServer and the GMap demo. The [http://www.maptools.org/ms4w/index.phtml MS4W] or [http://www.maptools.org/ms4w/index.phtml OSGeo4W] packages can do the this job well really well. |
| | 53 | |
| | 54 | Once it's done, extract the attached foss4g08_fusionlab_file_only.zip file in a web visible directory. |
| | 55 | |
| | 56 | Note that all the HTML page point to /fusion/ and /fusion-1.1.0-rc1/ for the root of Fusion. You may need to change that to fit your Fusion installation. |
| | 57 | |
| | 58 | == Content == |
| | 59 | |
| | 60 | * foss4g08_fusionlab_file_only.zip |
| | 61 | * Contains only the HTML, XML and images to make the lab work |
| | 62 | * foss4g08_fusionlab_ms4w.zip contains: |
| | 63 | * Fusion 1.0 |
| | 64 | * Fusion 1.1 RC1 |
| | 65 | * This Fusion lab |
| | 66 | * The GMap demo |
| | 67 | * !FusionIntro.odp |
| | 68 | * Open Office slides |
| | 69 | * FusionIntro.pdf |
| | 70 | * Printable version of the slide |
| | 71 | * Jx.pdf |
| | 72 | * Really good Jx description by Paul Spencer |
